jquery html() 的问题答案

【问题标题】：Issues with jquery html()jquery html() 的问题
【发布时间】：2014-12-13 05:00:15
【问题描述】：

在从元素中正确获取操作数据时遇到一些问题。互联网上的任何地方似乎都没有用简单的答案来涵盖如此简单的问题。请帮忙。

我使用返回的 ajax 请求操作了一个元素：

$("#last_comment_added").html("1457856458")

现在我在页面上的功能：

jQuery(document).ready(function($) {
  var post_slug = $("#post_slug").html();
  var last_comment_added = $("#last_comment_added").text();

  if (post_slug && last_comment_added) {

    setInterval(function() {
      $.ajax({
        type: "POST",
        url: "ajax_comments.php",
        data: {
          "task": "updates",
          "post_slug": post_slug,
          "last_comment_added": last_comment_added
        },
        cache: false,
        success: function(html) {
          eval(html)
        }
      });
    }, 10000);
  }
});

我从元素中获取旧数据，而不是新的 ajax“1457856458”数据。

请帮忙。

【问题讨论】：

控制台有错误吗？为什么eval(html) 挂在那里？将其记录到控制台以查看您是否获得了正确的结果。
没有错误。我的代码工作正常。问题是它返回旧数据（页面最初加载时）而不是新数据（在 ajax 请求之后）。我怀疑这是 DOM 没有更新。我想知道是否有办法更新 DOM。
当然，只需将要更新的整个 html 放在一个 div 中，然后使用 .html() 函数将特定 div 的内容更改为 success 函数中的新内容。

标签： javascript jquery html ajax dom

【解决方案1】：

不要使用 eval。

试试

$(document).ready(function() {

    var post_slug = $("#post_slug").html();
    var last_comment_added = $("#last_comment_added").html();

    if (post_slug && last_comment_added) {

      setInterval(_update, 10000);

    }

});

function _update() {

   $.ajax({

        type: "POST",
        url: "ajax_comments.php",
        data: {
          "task": "updates",
          "post_slug": post_slug,
          "last_comment_added": last_comment_added
        },
        cache: false,
        success: function(data) {

            $("#last_comment_added").html(data)       

        }

    });

}

而您仅从 PHP 返回 NEW 数据。（类似于：echo '1457856458';）

【讨论】：

【解决方案2】：

如果我理解您的问题，那只是您创建了这个名为 last_comment_added 的变量并期望它不断更新，您将它设置为 last_comment_added 的文本，它永远不会在您的区间函数中更新。这里有一个更改，它应该可以更好地为您服务。

jQuery(document).ready(function($) {
  var post_slug = $("#post_slug").html();
 
  if (post_slug && last_comment_added) {

    setInterval(function() {
      $.ajax({
        type: "POST",
        url: "ajax_comments.php",
        data: {
          "task": "updates",
          "post_slug": post_slug,
          "last_comment_added": $("#last_comment_added").text()
        },
        cache: false,
        success: function(html) {
          eval(html)
        }
      });
    }, 10000);
  }
});

【讨论】：

last_comment_added的初始化去哪了？
我把它拿出来了，而不是每次你调用 ajax 时，你都在拉取当时 ID 为 last_comment_added 的元素的文本。
这是您的代码 var last_comment_added = $("#last_comment_added").text(); last_comment_added 被初始化为元素的值，其中 last_comment_added 作为 ID，它在您的原始代码中设置了一次，似乎您在问为什么它不是在您进行 ajax 查询后更新为新值。我提供了一个答案，在运行查询时查询您传递给 ajax 查询的值。如果它不符合您的要求，请尝试使用更多详细信息更新您的问题。
感谢 Gibs，如果它是正确答案，那么您可以将其标记为这样，以便问题显示为已关闭。