1

我目前正在通过一个真实的网站项目学习 PHP，并希望使用 Ajax 调用来更改网站的各个部分。

代码示例

我的项目.js

$(document).ready(function() {
    $("#inventory").click(function() {
        $.ajaxSetup({
            url: "sectionhandler.php?section='inventory'",
            type: "get",
            dataType: "html"
        });
        $.ajax().done(function(html) { 
            alert(html); // This works!
            $("#section").html(html); // This doesn't work.
            $("#section").append(html); // This neither.
        });
    });
});

库存.html

<table><tr><td>Hello world with AJAX!</td></tr></table>

段处理程序.php

<?php echo file_get_contents( 'inventory.html' ); ?>

菜单.html

<a id="inventory" href="">Inventory</a>

索引.php

<div id="menu" class="content"><?php echo file_get_contents( 'menu.html' ); ?></div>
<div id="section" class="content"></div>

找到并阅读和尝试过相关文章

  1. XMLHttpRequest 在 IE 7/8 中不起作用，但在其他浏览器中起作用
  2. jQuery.ajax()
  3. jQuery.ajaxSetup()
  4. 。附加（）
  5. jquery .html() 与 .append()
  6. 无法使用 jQuery 将 HTML 代码附加到一个 div 中
  7. 使用效果 jQuery 将 Html 添加到 Div
  8. 使用 append() 将文本/html 添加到带有 jQ​​uery 的元素

还有更多...

结果

当我单击 Inventory 中包含menu.html并通过 显示的链接时index.php，jQuery 代码执行得很好。我从服务器获取结果，同时inventory.html从alert().

但是，当我将 设置为innerHTML时<div id="section" class="content"></div>，我似乎无法获得预期的结果。页面的背景似乎闪烁，虽然不应该按照 Ajax 定义，并且我的内容XMLHttpRequest.responseText永远不会显示。

当我双击Inventory链接时，我越接近让它工作，所以在页面背景的第一次“闪烁”之后，它显示了我的部分的内容。

我尝试了多种使用经典 Javascript 和标签上的onclick元素的方法<a>，我尝试过使用document.getElementById("section")，虽然获得了正确的元素，但我无法在页面上显示我的内容。

欢迎任何想法！

提前致谢 ！=)

4

2 回答 2

1

尽一切可能，您需要防止浏览器默认行为：

$("#inventory").click(function(event) {

    event.preventDefault();

    ...

});

注意event添加到点击处理程序的参数。

顺便说一句，您的 HTML 响应是无效的 - a<table>应该包含一个包装任何s的<tbody>元素。<tr>

于 2013-03-31T11:00:48.827 回答
1

按照要求。更简单的解决方案

$("#section").load("sectionhandler.php?section=inventory");

jQuery .load()

于 2013-03-31T19:32:21.587 回答