1

私は jquery プログラミングの初心者です。私のコードが悪い場合は申し訳ありません。

私は単純なhtmlファイルを持っています

<!DOCTYPE html>
<html>
<head>
 <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

 <script>
$(document).ready(function() {
    var arr = [];
    var items = {};
    $.getJSON('testjson.json', function(data) {
        $.each(data, function(key, value){
            arr.push(value);
        });
        arr.join(',');
        items = {source: arr};
    });
    $("input#autocomplete").autocomplete(items);
  });
  </script>
</head>
<body style="font-size:62.5%;">

<div id="Heading" >
<h2 align="center">Client Browser</h2>
</div>  
<input id="autocomplete" size="100" align="middle"/>

</body>
</html>

これは私の testjson.json ファイルです:

{
"1":"One",
"2":"Two",
"3":"Three"
}

Altova XML スパイを使用して html ファイルを実行すると、適切な出力が得られます。しかし、ブラウザー (XAMP サーバーを介して実行) で開くと、Firefox コンソールに次のように表示されます。

jquery-ui.min.js 5 行目の「this.source は関数ではありません」

ただし、たとえば、JS オブジェクトをオートコンプリート関数に直接渡すと機能します。次のコードは機能します。

$("input#autocomplete").autocomplete({source:["One", "Two", "Three"]});

アイテムに同じオブジェクトが含まれているため、問題がどこにあるのか理解できません。ここで何が正しくないのですか？

4

2 に答える 2

2

問題は、Ajaxリクエストが成功した後ではなく、リクエストが実行されると同時にオートコンプリートを初期化することだと思います。

対応する行を成功ハンドラー内に配置する必要があります。

$.getJSON('testjson.json', function(data) {
    $.each(data, function(key, value){
        arr.push(value);
    });
    arr.join(',');               // BTW, this line doesn't make any sense
    items = {source: arr};

    $("input#autocomplete").autocomplete(items);   // <-- place here
});
于 2012-06-13T22:37:59.937 に答える
1

この行を移動してみてください：

$("input#autocomplete").autocomplete(items);

getJSONコールバックに。すなわち

$.getJSON('testjson.json', function(data) {
    $.each(data, function(key, value){
        arr.push(value);
    });
    arr.join(',');
    items = {source: arr};
    $("input#autocomplete").autocomplete(items);
});
于 2012-06-13T22:41:31.307 に答える