2011-01-10 19 views
0

今日、私はJQueryを使い始めました。私はそれを行う方法のthis explanationを見つけた。私は、コードをコピー&ペーストし、それが動作しませんなぜjqueryからの自動補完が機能しないのですか?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/demo/main.css" type="text/css" /> 
    <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.css" type="text/css" /> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js"></script> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js"></script> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script> 
    <script> 
    $(document).ready(function(){ 
    var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax Utilities".split(" "); 
$("#example").autocomplete(data); 
    }); 
    </script> 

</head> 
<body> 
    API Reference: <input id="example" /> (try "C" or "E") 
</body> 
</html> 

:そのページで

私はまた、完全なコードを持っています。以前に言及したページ(JavaScriptがブラウザで有効になっている)で試してみるとうまくいきます。

エラーメッセージがなく、以前のjqueryの経験がないため、この問題を解決する方法を考えなければなりません。誰も私に助けてくれますか?

を追加しました:

私が重要になることが機能を見つけました。上記のコード/ページをロードすると、オートコンプリートは期待通りに機能します!ページをリロードすると、外観が少し変わります(入力フィールドとページの上部の間のスペースが表示されます)、オートコンプリートが機能しなくなります。それはあなたに何かを伝えますか?

+0

を添付してください。私はFirefoxを使用しています。 firebugをインストールします。これは、firefox用の素晴らしいデバッガです。 jQueryを使用する場合は、必ずそれが必要になります。 – simon

+0

うん、私のためにも働く。 –

+0

サーバーの設定に関する詳細情報で問題を正確にデバッグすることはできません。私はあなたがfirebug(http://getfirebug.com/)をインストールし、スクリプトが実行されているかどうかを確認することをお勧めします。 IEはこの種のスクリプトに問題があることが知られています。 –

答えて

2

それがあるべきだからです:$("#example").autocomplete({ source: data })

それはdocs you foundが古くなっているようです。より最新のバージョンまでここで見つけることができます:http://jqueryui.com/demos/autocomplete/

+0

オートコンプリート機能は、データを含む属性sourceを持つオブジェクトを受け入れます。その他の属性には、 - minlength(オートコンプリートをトリガする前に入力する必要がある文字の数)を無効にする(オートコンプリートを無効にする)、delay(オートコンプリートをトリガする前にキーストロークを待つ時間を1000ミリ秒で指定する)、appendtoに追加される)。 – Nikhil

+0

すべてのオプションでオートコンプリートを初期化するコードは、次のようになります。$( "#example")autocomplete({source:data、delay:10、minlength:3、appendTo: "#someElem"}); 初期化後にオプションをリセットするには、 ( "#example")。autocomplete( "option"、 "delay"、0); – Nikhil

+0

Marcus Ekwall、残念ながら問題を解決しませんでした。私は元の質問にいくつかの詳細を加えました。彼らはあなたにいくつかのヒントを与えるかもしれない?助けてくれてありがとう! – Roman

0

は( "").splitを試してみてください

var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax Utilities".split(" ,"); 

もまあ、それは私の作品sorce

+0

の例の1つに基づいてコードを作成してください。そのコードの最初の行は完全に間違っていて、次のような単一の値 'Array'を返すでしょう:' ["コアセレクタ属性トラバース操作CSSイベントエフェクトAjaxユーティリティ"] ' – mekwall

+0

私はそれが ["core"、 "selector"、 "traversing"] ...もしそのようなuが次に間違っていると言ってしまったら、私はcozを認めます。この完全な文をautocompleteオプションとしてのみ表示します... – Rafay

関連する問題