jQuery .each()添加事件处理程序

Question

我在jQuery中遇到了.each()函数的问题,当我成功获取Ajax并将其存储在数据变量中时,我正在调用这些行:

$.each(data, function() {
$('#modulesList').append("<p><a href='#'>" + this.code + "</a></p>")
  .click(function(){
    alert($(this));
   });
});

问题是,一旦我点击我的一个元素(一切看起来都很好并且文本正确),我会为每个元素弹出5次警报.迭代JSON中的0到5个对象.

谁知道为什么？

谢谢!

Answer 1

使用该appendTo方法

$("<p><a href='#'>" + this.code + "</a></p>").appendTo('#modulesList')
  .click(function(){
    alert($(this));
   })

jQuery~总是返回主元素:现在你的选择器是一个dom元素,它被创建并作为jQuery对象返回.

并回答你为什么得到5个警报的问题.在将click事件绑定到#modulesList数据数组中的每个对象的事件之前.(这就是5个警报的原因)

您还可以将<p><a>...变量存储在变量中:

var pAndATag = $("<p><a href='#'>" + this.code + "</a></p>");
$(modulesList).append(pAndATag);

希望你看到这是如何工作的......