Question

在实验jquery时,我创造了这个 html和javascript。

<body>
<div id="results">
<div class="mylinkdiv">
<a class="mylinkclass" href="#">8</a>
: This is supposed to be a toaster.
<br>
<a class="mylinkclass" href="#">14</a>
: with a toaster maybe.
<br>
<a class="mylinkclass" href="#">51</a>
: If we re really creative.
<br>

</div>
</div>
<button id="remove" type="button" > Remove</button>
<button id="add" type="button" > Add</button>

</body>

javascript 具有弹出含有链接文本的信件的函数。它还有一个函数可以添加一些链接到 div. A 函数上, 它被命名为删除, 从而删除了内部 div 。

$(document).ready(function(){
    $( .mylinkclass ).click(function(){
           getLinkText(this);
        });

    $( #remove ).click(function(){
           removeContents();
        });

     $( #add ).click(function(){
           addContents();
        });
});

function getLinkText(that){
    var txt = $(that).text();
    var num = parseInt(txt);
    alert( num= +num);
    return false;
}

function addContents(){
  $( #results ).append( <a class="mylinkclass" href="#">70</a>  new line1 <br> );
  $( #results ).append( <a class="mylinkclass" href="#">77</a> new line2<br> );
}

function removeContents(){
  $( .mylinkdiv ).remove();      
}

当我点击原始 html 页面的链接( 即 3 个链接 ) 时, 警示盒就会弹出。

当我点击添加按钮时, 它会为 div 添加两个新链接。但是, 当我点击这些新添加的链接时, 提醒不会弹出!

我不明白为什么... 有人能告诉我吗?

Answer 1

使用 jQuery 1. 使用 jQuery 1. 7 使用 jQuery 1.6 使用 jQuery 1.6 使用 jQuery 1.7 或.delgate 使用 jQuery 1.6 使用

jQuery( #results ).on( click , .mylinkclass ,function() {
    getLinkText(this);
});

""http://jsfiddle.net/mprabhat/J7YCX/2/" rel="no follow" >Demo

另一个你可以这样做的方法是克隆你现有的元素, Demo

var cloned = jQuery( .mylinkclass:last ).clone(true);
jQuery( #results ).append(cloned);

在第二种情况下,也会复制聆听者,而您不需要使用.on或.delegate。

Answer 2

您需要一个“ 强势” a href=" http:// api.jquery.com/ delegate/" rel=" nofollow" >delegate 事件处理程序, 因为您的项目是在 Dom 装载后动态创建的。

$( #results ).on( click ,  .mylinkclass , function() {
    getLinkText(this);
});

Answer 3

当第一次装入页面后添加链接到 DOM 时,链接不受 jQuery 事件的约束。您应该使用 :

$(document).on( click ,  .mylinkclass , function() {

});

我第一次遇到这个问题时就用了"Live()", 但是你不应该用这个, 因为根据jQuery的文件,它已经过时了。

Answer 4

你必须这样去做:

$ ( . mylinkclass ). live ( click , function () {
alert ( OK )
});

友情链接