2

#foo アンカー タグの後に、新しく追加されたアンカー タグ (.he) のクリック イベントを添付しようとしています。しかし、クリックイベントは発生していません。(.on) を使用しました。これで私を助けてもらえますか？*

        <!DOCTYPE html>
        <html>
        <head>
        <title>Attaching event</title>
       <style>p { background:yellow; margin:6px 0; }</style>
       <script src="js/jquery.js"></script>
        </head>
    <body>
    <p>Hello</p>
    how are
    <p>you?</p>

    <button>Call remove() on paragraphs</button>

    <a id="foo" href="#" style="display:block">Testing the bind and unbind</a>


    <script>
        $("button").on('click',function () {

            $("#foo").after("<a class='he' href='#'>asdfasdf</a>");

        });
        $(".he").on('click', function(){
                alert("test");
        });     

    </script>
</body>

4

6 に答える 6

5

このような静的親要素に委任する必要があります

$(document).on('click','.he',function(){

//code here
});
于 2013-02-20T08:54:50.377 に答える
0

代わりに、次のようにDOMに追加する前にクリックイベントをアンカーにバインドできます。

 var $he = $("<a class='he' href='#'>asdfasdf</a>").on('click', function(){
                 alert("test");
            })
 $("#foo").after($he);
于 2013-02-20T09:02:38.750 に答える
0

ドキュメントに追加する直前に、ハンドラーをアンカーにアタッチできます。

$("button").on('click',function () {
   $("<a class='he' href='#'>asdfasdf</a>")
      .on('click', function(){
         alert("test");
      })
      .insertAfter("#foo");
});

または、アンカーのすべてのクリックをheクラスとしてキャッチするデリゲートハンドラーをドキュメントにバインドします。

$(document).on('click', 'a.he', function() {
   alert("test");
});
$("button").on('click',function () {
   $("<a class='he' href='#'>asdfasdf</a>").insertAfter("#foo");
});
于 2013-02-20T09:03:06.077 に答える
0

イベント委任を使用する

$("body").on("click", ".he", function() {
    alert("test");
});

の代わりに、body任意の静的親要素を使用できます.he。

于 2013-02-20T08:55:07.123 に答える
0

使用して.liveください。コードを jquery clausure 内に追加することを忘れないでください

<script>
    $(function(){
        $("button").on('click',function () {
            $("#foo").after("<a class='he' href='#'>asdfasdf</a>");
        });

        $(".he").live('click', function(){
            alert("test");
        });
    });
<script>
于 2013-02-20T08:55:59.593 に答える
0

以下のコードを $("button").click ブロック内に配置する必要があります。

  $(".he").on('click', function(){
                    alert("test");
            });

jsfiddle へのリンクhttp://jsfiddle.net/wbWLE/

于 2013-02-20T08:57:40.147 に答える