如何在另一个jQuery函数上调用jQuery函数？

Question

如何在另一个jQuery函数上调用jQuery函数？

我正在尝试使用jQuery setInterval和load函数刷新div的内容。 到目前为止，除了加载整个div（包括div标签）之外，其他所有东西都工作正常。 我只希望div的内容重新加载/刷新。 我尝试添加jQuery函数text() ，但是它不起作用，或者可能是我编写了错误的语法。

$('#numberOfTries').load('index.php #numberOfTries').text(); 不起作用。

到目前为止，这是我可以使用的，但是可以用div标签加载整个div：

Index.php的HTML（顶部）

<div id="numberOfTries"><?php echo $numberOfTries; ?></div>

JS of Index.php（底部）

<script src="assets/js/jquery.min.js"></script> 
<script>
$(document).ready(function() {
    setInterval(function() {
        $('#numberOfTries').load('index.php #numberOfTries');
    }, 1000);
});
</script>

该脚本加载整个div，即<div id="numberOfTries">50</div> ，但是我只想加载div的内容，即50 。

当脚本运行时，HTML最终看起来像这样：

<div id="numberOfTries">
<div id="numberOfTries">50</div>
</div>

但我只希望它看起来像这样：

<div id="numberOfTries">
50
</div>

我认为我的语法$('#numberOfTries').load('index.php #numberOfTries').text(); 是不正确的。

请让我知道是否需要澄清。

Answer 1

您误解了.load()的使用。

在通话中，您正在加载index.php页面，并获取ID为numberOfTries的元素，并将其放在同一div 。

要实现您想做的事情，您需要使用.load()回调：

$("#numberOfTries").load("index.php #numberOfTries", function() {
  // Load the resource and look for the element.
  // When it's done, return this element .text().
  return $(this).text();
}).text();

jQuery .load（）

附带说明一下，值得澄清的是.text()可以很好地配合您的示例使用，但您会将一个div嵌套在另一个示例中，更糟糕的是，它们都共享相同的ID。

但这还是可以的： Demo

Answer 2

如果您不希望发生嵌套的div，则可以使用.replaceWith（），以便替换整个DIV。 也许您必须将.load（）中的成功数据保存在变量中才能执行此操作。