0

.change() を使用してドキュメントの変更を検出できることは知っていますが、これは読み込み時に select 要素が存在する場合にのみ機能するようです。

ajax を介して多数の選択要素を呼び出すページがあり、各選択の変更を検出する必要があります。

何か案は？

4

3 に答える 3

3

これを行うには、次の 2 つの通常の方法があります。

  1. 要素をページに追加した後.change()、適切なセレクターを使用して呼び出します (Ajax 成功ハンドラーから、または任意の場所から)。

  2. ページの読み込み時に存在する親要素または祖先要素にアタッチされた委任イベント ハンドラーをセットアップします (documentより近い祖先がない場合)。

メソッドを使用して委譲ハンドラーを作成する.on()方法は次のとおりです。

$("#idOfAncestorThatExistsOnLoad").on("change", "selectorOfDynamicElements", function() {
     // do something here
});

変更イベントが先祖要素に到達すると、jQuery は自動的に、それが 2 番目のパラメーターのセレクターに一致する要素から発生したかどうかをテストし、一致する場合にのみハンドラー関数を呼び出します。

于 2013-10-16T09:32:53.760 に答える
0

あなたは次のようにすることができます、

のselect

<select name="demo" id="demo"  onchange="selectRequest('demo');">

ファイルjs内

function selectRequest(id) // id of select
{
   var selectVal = $('#' + id).val(); // currently selected 
   // rest do with the val
}

屈服する必要はありません$(document).ready()

これが作業コードです。

<html>
    <head>
        <title>Test</title>
        <script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
        <script>
            function selectRequest(id) // id of select
            {
                var selectVal = $(id).val(); // currently selected 
                alert(selectVal)
                // rest do with the val
            }
        </script>
    </head>
    <body>
        <select name="demo" id="demo"  onchange="selectRequest(this);"> 
            <option value='1'>1</option>
            <option value='2'>2</option>
        </select>
    </body>
</html>
于 2013-10-16T09:43:42.327 に答える
0

適切なアプローチは、イベントを特定のセレクターにバインドすることです

$(document).on('change', 'select', handlerFunction);

これで、イベント ハンドラーがバインドされましたが、要素documentのみに影響します。selectAJAX を使用してデータをロードすると、ハンドラーは新しい選択ですぐに機能します。

于 2013-10-16T09:33:01.230 に答える