javascript - 点击查看附加的html

Question

我有这样的html：

<a class="link">text</a>
<div class="items"></div>

(function($) {

  var link = $('.link');
  link.click(function(){
    alert('it works!');
  });

  $('.items').each(function() {
    var items = $(this),
        item = $('<div>something inside</div>');

    items.append(item);
    item.click(link.click());
  });

})(jQuery);

我正在尝试click为附加的item. 所以当我们点击时item，link应该会启动。

但是我从 jQuery 内部的某个地方得到一个错误Uncaught TypeError: Object [object Object] has no method 'apply'。

怎么了？

Answer 1

您需要event delegation动态添加的元素：

items.on('click', item, function(){
     link.click();
});

试用小提琴：http: //jsfiddle.net/qQLLL/

Answer 2

也许你应该试试。像这样：

function myClick(){
  alert('it works!');
}

$(".link").click(myClick);

$('.items').each(function() {
  var items = $(this),
      item = $('<div>something inside</div>');

  items.append(item);
  item.click(myClick);
});

Answer 3

尝试事件委托

 items.on('click', item, function(){
    link.click();
 });

如果您想了解有关事件委托的更多信息， 请通过链接

Answer 4

试试这个

(function($) {
    var handleClick = function() {
        alert('it works!');
    };
    $('.link').click(handleClick);
    $('<div>something inside</div>').appendTo('.items').click(handleClick);
})(jQuery);

Answer 5

你的错误是：

item.click(link.click);

应该

item.click(function(){ link.click() });