非常简单的 Javascript 部分页面刷新调用 .php 页面不起作用答案

【问题标题】：Very simple Javascript partial page refresh calling a .php page not working非常简单的 Javascript 部分页面刷新调用 .php 页面不起作用
【发布时间】：2013-01-19 21:59:51
【问题描述】：

我已经在互联网上搜索了几个小时，但仍然无法使这个简单的示例工作。我希望有人可以帮助我。我正在尝试使用 Javascript 来显示 php 文件的内容。显示应该经常刷新，因为最终它将用于显示来自 MySql 数据库的文本匹配项，这些匹配项与在搜索栏中输入的字符匹配（类似于 Google 的搜索栏）。我将为此使用 setinterval，但我还没有。我的问题是我有很少的 javascript/AJAX 经验，只是无法让它工作。我已经将它简化为一个简单的请求，但仍然无法使其工作。请建议什么不起作用：

应该可以查看内容的 index.html 是：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
</head>

<body>

<script type="text/javascript">

$().ready(function() {
$("#dynamic").load("blasty.php");
});

</script>
<div id="dynamic"></div>
</div>
</body>
</html>

blasty.php 包含：

<?php
echo "hello cruel world!";
?>

提前致谢！

【问题讨论】：

这对我来说看起来不错，但使用 $(document).ready 而不是 $()。我认为这不会解决它，但它是首选。更好的是$(function () {
您确定blasty.php 存在于该页面所在的任何目录中吗？您是否在控制台中遇到任何错误？
我试过 $(document).ready 方法和 $(function)... 没有运气。是的，blasty.php 在同一个目录中。控制台中的错误是什么意思？我在屏幕上或源代码中看不到任何错误。谢谢！
你用什么浏览器调试？如果是firefox，你有firebug吗？
刚刚下载了 Firebug，问题就解决了。感谢您的帮助，有关该问题的更多信息在此页面上的另一个 cmets 中（我无法结束该问题，因为我是这里的 n00b...

标签： php javascript jquery html refresh

【解决方案1】：

您在$() 中缺少document 变量。

<script type="text/javascript">

$(document).ready(function() {
    $("#dynamic").load("blasty.php");
});

</script>

在视觉上这是我看到的唯一问题。

【讨论】：

我已经添加了您指出的缺失文本，但它仍然无法正常工作。当我查看 index.html 时，我只看到一个空白页。如果有什么不同，我正在使用新版本的 Firefox。
检查 Firebug 中的响应以确保请求正在通过并且 blasty.php 在您的主目录中。

【解决方案2】：

我使用$.get 而不是$.load。

试试这样的：

$.get("blasty.php",
      { nbRandom: Math.random() },
      function(data){
        $("#dynamic").html(data);
      });

nbRandom是防止IE缓存。

使用 Firebug 确保有来自 AJAX 的响应并从那里开始。

【讨论】：

尽管它们大致相同。但我确实认为他应该检查 Firebug 或 Chrome 开发者工具中的响应。
我知道了，谢谢大家的帮助！在提示检查 Firebug 控制台后，我执行了以下操作： 1. 搜索 Firebug 以查看它是什么。 2. 为网页开发者提供的 Firefox 插件。下载并安装它。 3. 在控制台打开的情况下刷新页面，发现它找不到我在标题中的 JQuery 链接。 4. 更新了指向“ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js”的链接，现在它可以工作了。感谢大家的快速帮助！

【解决方案3】：

确保您的 blasty.php 文件在同一个域中。

此外，为了帮助调试 javascript，请在 Chrome 或 Firefox 中右键单击并转到检查元素。然后转到控制台窗口，它将显示大多数错误。

我还推荐这个关于 javascript 的 youtube 视频。我它帮助我弥合了一些 javasrcipt 陷阱的差距。 http://www.youtube.com/watch?v=ljNi8nS5TtQ

这是一个关于调试器的链接：https://developers.google.com/chrome-developer-tools/

正如@Explosion Pills 所说，FireFox 的 Firebug 是另一个不错的选择。我将使用两者来帮助调试 javascript。 Firebug 很好，因为在 Net 选项卡下，它会显示在后台发生的实际 http 请求，包括参数、响应、标头信息等。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    </head>
    <body>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#dynamic").load("blasty.php");
    });
    </script>
    <div id="dynamic"></div>
    </div>
    </body>
    </html>

【讨论】：