6

チェックボックスがチェックされているときにJQueryを起動しようとしています。最初に、私の JQuery は静的要素に対してのみ機能することに気付きました。いくつかの投稿を読んだところ、動的に追加された要素に対して同じ JavaScript を起動するには、.on("click, function()) が必要であることがわかりました。

ただし、この方法はまだ私にはうまくいきません。誰でも助けることができますか？ありがとうございました。

$(document).ready(function(){
    $("input[name='todo']").on('click', function(){
    var isChecked = this.checked
           if (isChecked == true){
          $(this).next().remove();
          $(this).remove(); 
        }
        if (isChecked == false)
        {
        alert("checkbox is NOT checked");
        }

        });

    });

私のサンプルアプリ: http://jsfiddle.net/JSFoo/7sK7T/8/

4

4 に答える 4

11

委任が必要です:

$('#ToDoList').on('click', "input[name='todo']", function() { ... });

http://jsfiddle.net/7sK7T/9/

ドキュメント: http://api.jquery.com/on/#direct-and-delegated-events

PS: 重要な注意 - ハンドラーをバインドする要素を、ターゲット要素のできるだけ近くで指定する必要があります。あなたの場合、そうで#ToDoListはないbodyかdocument、他の回答のアドバイスとして。

于 2013-10-04T23:46:44.383 に答える
3

以下はあなたが必要としていたものです。少し異なる構文です

$(document).on('click', "input[name='todo']", function(){
于 2013-10-04T23:54:39.637 に答える
3

動的要素の場合、次のようなことをしたいでしょう

$(document).ready(function () {
    $(document).on('click', "input[name='todo']", function () {
        var isChecked = this.checked
        if (isChecked == true) {
            $(this).next().remove();
            $(this).remove();
        }
        if (isChecked == false) {
            alert("checkbox is NOT checked");
        }

    });

});

以前のように使用する場合は、必要な要素を選択し、それらの要素にイベントを適用しているためon('click')、基本的に同じです。イベントが発生します。click();document

document必要に応じて、クリックする要素の閉じたコンテナーに変更することもできます。

これはイベント委任と呼ばれます

jQuery Learn イベント委任

于 2013-10-04T23:46:28.337 に答える
1

ドキュメントの準備ができたときに要素をバインドします。これは、要素が作成される前です。作成後にバインドする必要があります。

または、それらのコンテナを document.ready にバインドすることもできます:

$("#containerDiv").on('click', "input[name='todo']", function(){
   // .... your code
});
  • 「containerDiv」はこれらのチェックボックスの親要素である必要があり、ドキュメントの準備ができているページにある必要があります!
于 2013-10-04T23:50:53.370 に答える