2つのjsonファイルをマージしてオートポッププラグインで使用する

Question

2つのJSONファイルをマージしてオートコンプリートプラグインで使用しようとしています。

しかし、私は自動完了とjqueryの両方に対してjsライブラリを追加したとしてもエラーTypeError: $(...).easyAutocomplete is not a functionを取得します。

私のコードは次のようになります。

<script src="jquery-3.1.0.js"></script> 
<link href="easy-autocomplete.min.css" rel="stylesheet" /> 
<script src="jquery.easy-autocomplete.min.js"></script> 



<script> 
    $.getJSON("file1.json", function (data1) { 
     $.getJSON("file2.json", function (data2) { 
      var final = $.extend({}, data1, data2); 
      var options = { 
       data: final, 
       getValue: "name", 
       list: { 
        match: { 
         enabled: true 
        } 
       }, 
       theme: "square"   
       }; 
      $("#KUNDE").easyAutocomplete(options); $('div.easy-autocomplete').removeAttr('style'); 
     }); 
    }); 
    </script> 

Answer 1

私はあなたのコードに基づいて実施例を行いました。

スクリプトファイルを含めるときに正しいパスがあることを確認してください。また、jQueryが含まれているかどうかを確認します。

希望はあなたを助ける：

$.getJSON("https://api.myjson.com/bins/42jd0", function (data1) { 
 
    $.getJSON("https://api.myjson.com/bins/5bjqc", function (data2) { 
 
    var final = []; 
 
    final.push(data1.employees1); 
 
    final.push(data2.employees2); 
 
    var new_final = final[0].concat(final[1]); 
 
    var options = { 
 
     data: new_final, 
 
     getValue: "firstName", 
 
     list: { 
 
     match: { 
 
      enabled: true 
 
     } 
 
     }, 
 
     theme: "square"   
 
    }; 
 
    $("#KUNDE").easyAutocomplete(options); $('div.easy-autocomplete').removeAttr('style'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/easy-autocomplete.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/easy-autocomplete/1.3.5/jquery.easy-autocomplete.min.js"></script> 
 

 
<div class='easy-autocomplete'> 
 
    <input id="KUNDE"/> 
 
</div>

あなたはRun code snippetボタンを押すことで、ここでコードを実行することができますか、また、私はhereを作ったjsfiddleを確認することができます。