jQuery ajax 问题，堆叠 div

Question

我有一些代码用于动态加载我的部分网页：

$('a#ajax-call').click(function (e) {
    $("#container").load('/process.php',{id:myID},function(data){
        return;
    });
    e.preventDefault();
}); 

返回此 html 方案：

<div>my ajax loaded content</div>

并附加到这个方案：

<div id=container>
     <div>php loaded content 1</div>
     <div>php loaded content 2</div>
     <div id="static">php loaded content static</div>
     <div>php loaded content 3</div>
     ... until 12 divs...
</div>

问题是，负载正在替换 #container 的全部内容，我需要这样显示：

<div id=container>
     <div>ajax loaded content </div>
     <div>php loaded content 1</div>
     <div id="static">php loaded content static</div> <--- remains static
     <div>php loaded content 2</div>
     ... until 12 divs...
 </div>

有什么想法吗？

Answer 1

$('a#ajax-call').click(function (e) {
    e.preventDefault();
    $.ajax({
    url: '/process.php',
    type: "POST",
    data: "id="+myID,
    cache: true,
    success: function(data){
    $("#container").append(data);           
    }
    });
});

并将您的锚标记修改为

<a href="javascript:;" id="ajax-call"> ... </a>

如果你没有使用 e.preventDefault(); ajax调用中的函数

Answer 2

也许可以试试：

$.get('/process.php', {id: myID}, function(data) {

    $("#container").append(data);
    return;
});

根据jQuery关于$.load()的文档：

当检测到成功响应时（即当 textStatus 为“success”或“notmodified”时），.load() 将匹配元素的 HTML 内容设置为返回的数据。