1

こんにちは、私は次のように ul と li を生成しており、クリック イベントを発生させたいのですが、delegate()、on()、および click() メソッドは機能しません。私が使用できる他の方法は、私を助けてください??/ここで「loadpage」は、私のhtmlコードに存在するdivです

<script type="text/javascript">
       $(document).ready(function() {
             $('#LoadPage').append('<ul class="testul" id="list">');
                 for (var i = 1; i < 5; i++) {
                   $('#list').append('<li class="clicks" id="item'+i+'"></li>');
                 }          
             $('#LoadPage').append('</ul>');
        });

            // click event works  wtih .live() onlyyy.......................
        $('.clicks').live('click', function() {
            alert('hello');
        });






        /*$(".clicks").on("click", function(){
            alert('hello');
        });
        $("#testul").delegate("li", "click", function() {
        alert('hello');
        });



        $("#testul").delegate("li", "click", function() {
            alert('hello');
              });*/

    </script>
4

5 に答える 5

4

ドキュメントが実際に存在するため、セレクターはドキュメント上で一致する必要があります。次に、存在するクリックのセレクターを渡します。最初に .clicks を照合すると、結果セットは空になり、何も起こりません。

$(document).on("click", ".clicks", function(){ 
        alert('hello'); 
});

liveのドキュメントでは、それを使用するコードを変換してonまたはdelegateを使用する方法について説明しています: http://api.jquery.com/live/。

于 2012-07-10T05:43:00.363 に答える
2

うーん..

私はそれを試してみましたが、うまくいきました

これを試してください

于 2012-07-10T05:42:49.250 に答える
1

メソッド delegate()、on()、および click() は、まだ html をロードしていないため機能しません。li 要素を読み込んだ後に定義してみてください。

<script type="text/javascript">
    $(document).ready(function() {
        $('#LoadPage').append('<ul class="testul" id="list">');
            for (var i = 1; i < 5; i++) {
              $('#list').append('<li class="clicks" id="item'+i+'"></li>');
            }          
        $('#LoadPage').append('</ul>');
        $('.clicks').click(function() {
            alert('hello');
        });
     });
</script>
于 2012-07-10T05:46:39.577 に答える
1 
    $(document).ready(function() {
         $('#LoadPage').append('<ul class="testul" id="list">');
             for (var i = 1; i < 5; i++) {
               $('#list').append('<li class="clicks" id="item'+i+'"></li>');
             }          
         $('#LoadPage').append('</ul>');
    });

        // click event works  wtih .live() onlyyy.......................
    $('.clicks').live('click', function() {
        alert('hello');
    });

これを次のように変更するだけです

    $(document).ready(function() {
         $('#LoadPage').append('<ul class="testul" id="list">');
             for (var i = 1; i < 5; i++) {
               $('#list').append('<li class="clicks" id="item'+i+'"></li>');
             }          
         $('#LoadPage').append('</ul>');
         // click event works  wtih .live() onlyyy.......................
         $('.clicks').click(function() {
             alert('hello');
         });
    });

以前は、これらの<li>アイテムは DOM に存在しませんでした。DOM に挿入した後、任意の機能を持つことができます。

于 2012-07-10T05:48:42.423 に答える
0

jQuery 1.7 以降、.live() メソッドは廃止されました。

jQuery のどのバージョンを使用していますか? バージョン 1.7 で追加されました。こちらのドキュメントを参照してください。

適切なバージョンの jQuery を含めれば、問題なく動作するはずです。

デリゲートに関しては、ここでこれを試してください

于 2012-07-10T05:49:41.307 に答える