javascript - 为什么我的 jquery .load() 函数不起作用？

Question

我的网站上有一个按钮，单击该按钮时，应将 html 加载到 div 容器中。

我正在为按钮使用以下代码：

<div id="nextnr1"><a href = "#">Next&gt;&gt;</a></div>

以下代码在有人点击 div 时执行加载：

<script type="text/javascript">
    $(document).ready(function() {
        $("#nextnr1").mousedown(function() {
            $("#Container").load("wrappers.php?currenttab=1&shift=1");
        });
    });​
</script>

这是加载 HTML 的容器的代码：

<div id="Container"></div>

问题是上述所有代码大部分时间都在工作。只是偶尔该功能.load无法完成他的工作。这是针对类似情况的，因为它大约是同一页。

我检查了当点击时该函数被调用为：$(document).ready并且$("#nextnr1").mousedown(function() {..}正在做他们的工作。Only.load没有做它的工作，因为我检查了没有HTTP 请求发送到服务器。

如果有人可以帮助我解决这个问题，我将非常感谢。

更新 1

我尝试了消息框（请参见下面的代码），它显示当加载未执行时，它也没有显示消息框加载已执行。我还看到 2/3 分钟后突然出现消息框并重新加载！但是它确实有效，但有时会有很大的延迟。

$(document).ready(function() {
   $("#renextnr2").click(function() {
      $("#Container").load("wrappers.php?currenttab=2&shift=1", function() {
           alert("Load was performed.");
      });
   });
});

Answer 1

首先，尝试使用'click'而不是mousedown。

其次，尝试将 'click' 事件挂钩到链接而不是 div：

<div><a id="nextnr1" href = "#">Next&gt;&gt;</a></div>

Answer 2

我在解决问题的 URL 末尾添加了一个随机数。

Answer 3

您可能需要阻止事件传播/默认处理：

<div><a id="nextnr1" href="#">Next&gt;&gt;</a></div>

<script type="text/javascript">

$(document).ready(function() {
$("#nextnr1").click(function(e) {
  e.preventDefault();
  e.stopPropagation();
  $("#Container").load("wrappers.php?currenttab=1&shift=1");
});});

</script>

Answer 4

首先要添加一个警报来调试事件是否被触发，如下所示。这将更好地了解需要仔细查看以确定问题的区域。

$('#Container').load('wrappers.php?currenttab=1&shift=1', function() {
  alert('Load was performed.');
});

Answer 5

如果服务器端代码 (PHP) 出现问题，jquery load() 函数的行为可能会不一致。

我遇到了一个问题，即 load() 在我的本地站点上运行，但在我的主机上运行不一致。原来我写了一些糟糕的 PHP，在我的本地环境中没有引起任何问题，但是当我部署到主机时却引起了问题。

如果您直接访问 URL，请检查以确保您使用 javascript 加载的 URL 可以在您的浏览器中加载。这将告诉您这是 javascript 还是服务器端问题。