Question

我正在尝试循环所有匹配的结果，以便它们以列表形式出现。我尝试过使用 $（'div＃comments'）。html（commentdata）; - 但它只显示数据的第一个匹配/第一条评论。

然后我尝试使用 .append 而不是 .html ，这显示所有评论都可以 - 但每次运行onClick事件时都会再次添加所有数据附在请求上。

简而言之;我如何列出我的所有评论，而不是每次点击加载它们的对象时都添加/追加它们。

var xml = data.responseXML;

var comments = xml.documentElement.getElementsByTagName("comment");

for (var i = 0; i < comments.length; i++) {

      var user = comments[i].getAttribute("username");
      var comm = comments[i].getAttribute("comment");
      var commentdata = "<li>"+ user +" - " + comm +"</li>";

      $('div#comments').append(commentdata);

}

Answer 1

var xml = data.responseXML;

var comments = xml.documentElement.getElementsByTagName("comment");

// html collection
var commentdata = [];

// open <ul>
commentdata.push('<ul>');

// cache this
var len = comments.length;
for (var i = 0; i < len; i++) {

      var user = comments[i].getAttribute("username");
      var comm = comments[i].getAttribute("comment");

      // add <li> element
      commentdata.push("<li>"+ user +" - " + comm +"</li>");

}

// end <ul>
commentdata.push('</ul>');

// update <div id="comments"> contents
$('div#comments').html(commentdata.join("\n"));

Praveen也是正确的，您可以在开始附加数据之前清空容器：

$('div#comments').empty();

Answer 2

    var xml = data.responseXML;

    var comments = xml.documentElement.getElementsByTagName("comment");

// clear previous data here
    $('div#comments').empty();

    for (var i = 0; i < comments.length; i++) {

          var user = comments[i].getAttribute("username");
          var comm = comments[i].getAttribute("comment");
          var commentdata = "<li>"+ user +" - " + comm +"</li>";

          $('div#comments').append(commentdata);

    }

Answer 3

您可能正在寻找.one()事件附件方法。例如，

$("#id-of-thing-to-click").one("click", function () {
    // the code from your post
});

点击事件只会在用户第一次点击#id-of-thing-to-click时触发，而不是每次都点击。

Jquery循环结果

3 个答案: