javascript - JQuery 添加 HTML 和事件

Question

我目前在 JQuery 1.3.2 中有以下内容

for (i = 0; i < totalPages; i++) {
   var newDiv = $("<a href=\"#\">").append(i+1).click(function() 
   { 
      alert(i+1);
   });
   $('#pageLinks').append(newDiv).append(" ");
}

这会根据需要输出一个数字列表，但是单击生成的元素时的警报会返回 totalPages 值，而不是循环期间 i 的值。如何让点击事件来提醒 i 的值？

谢谢

score 3 · Accepted Answer

试试这个

for (i = 0; i < totalPages; i++) {
   var newDiv = $("<a href=\"#\">").append(i+1).click(function() 
   { 
      alert(this.text);
   });
   $('#pageLinks').append(newDiv).append(" ");
}

score 0 · Accepted Answer

此代码应该解决您的问题：

for (i = 0; i < totalPages; i++) {
    var newDiv = $("<a href=\"#\">")
        .append(i+1)
        .click(
            function() { 
                alert($(this).html());
            }
         );
    $('#pageLinks').append(newDiv).append(" ");
}

score 0 · Accepted Answer

例如，如果您没有将数字的文本作为链接的一部分，我喜欢将这样的值编码到 id 中，这将为您提供：

<body>
<div id="pageLinks"><!-- --></div>

<script>
var totalPages = 10, newDiv;
for (i = 0; i < totalPages; i++) {
  var link = "<a href=\"#\" id=\"link-"+(i+1)+"\">"+(i+1)+"</a>";
  newDiv = $(link).click(function() {
    alert($(this).attr('id').split('-')[1]);
  });
  $('#pageLinks').append(newDiv).append(' ');
}
</script>
</body>

score -1 · Accepted Answer

这是一个范围相关的问题。您需要使用我称之为范围保护的 for 循环中的语句形成一个闭包。像这样的东西：

var totalPages = 10;
for (i = 0; i < totalPages; i++) {
    (function() {
        var no = i + 1;
        var newDiv = $("<a href=\"#\">").append(i+1).click(function() {
        alert(no);
    });
    $('#pageLinks').append(newDiv).append(" ");
})();

javascript - JQuery 添加 HTML 和事件

4 回答 4

Related

Reference