1 
jQuery('#sbox-window').on('change', '#filter-by-site', function(){
    console.log(jQuery(this).val());
    console.log('change');
});


<div id="sbox-window">
    <div id="sbox-content">
        <p>
            <select id="filter-by-site">
                <option value="null">Filter cameras by site</option>
                <option value="1">Site 1</option>
                <option value="2">Site 2</option>
                <option value="3">Site 3</option>
            </select>
        </p>
    </div>
</div>

何も起こりません...非推奨の場合live()、すべて正常に動作します。問題はどこですか？

4

8 に答える 8

3

実際、これは機能します。Jquery テンプレートの一部である「sbox-window」または div を動的に生成する他の手段にイベントをアタッチしている可能性はありますか? 実装によっては、ドキュメント中に「sbox-window」div が存在しないため、準備ができているので、より高い Dom-Object にバブルアップする必要があります--- ドキュメントの最悪のケース...しかし、私はそうしませんこれが、「ライブ」が機能する理由でもあります。

于 2012-12-14T11:15:41.930 に答える
1

使用する：

jQuery(document).on('change', '#sbox-window #filter-by-site', function(){
    console.log(jQuery(this).val());
    console.log('change');
});

あなたがそうするとき、jQuery('#sbox-window')そのような要素はまだないので（DOMが順番に構築され、ブロックを下に定義するため）、on要素の空の配列に対してメソッドを呼び出しますが、もちろん効果はありません。

前述したように、別のオプションがあります。

$(document).ready(function() {
   $('#sbox-window').on('change', '#filter-by-site', function(){
       console.log($(this).val());
       console.log('change');
   });
});
于 2012-12-14T11:10:38.543 に答える
0

要素で $.bind を使用できます。

または、はるかに優れているのは、jquery をまったく使用せずに次のようにすることです。

document.querySelector('#filter-by-site').addEventListener('change', changeHandler);

function changeHandler(e) {
    console.log('change');
}
于 2012-12-14T11:14:20.400 に答える
0

それは私にとってはうまくいきます：

デモ

このon()メソッドは、jQuery バージョン 1.7 で追加されました。十分な新しいバージョンの jQuery が含まれていることを確認してください。

于 2012-12-14T11:10:37.183 に答える
0

委任を使用しているときに、#sbox-windowまだ DOM にない可能性があります。準備完了のコールバック関数でラップします:

$(function(){
   jQuery('#sbox-window').on('change', '#filter-by-site', function(){
       console.log(jQuery(this).val());
       console.log('change');
   });
});

.live() ドキュメントをデリゲートとして使用します。

于 2012-12-14T11:12:30.960 に答える
0

正常に動作しています。動作する例を参照してください。不足しているように見えるのは、DOM対応ハンドラーでクエリコードを実行することです。

$(document).ready(function() {
   $('#sbox-window').on('change', '#filter-by-site', function(){
       console.log($(this).val());
       console.log('change');
   });
});
于 2012-12-14T11:13:16.030 に答える
0

この方法も使用できます。

jQuery(document).on('change', '#filter-by-site', function(){
   console.log(jQuery(this).val());
   console.log('change');
});
于 2012-12-14T11:18:36.377 に答える
0

最新バージョンのjqueryライブラリを使用してください。正常に動作します

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
于 2012-12-14T11:23:17.107 に答える