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内容设置为返回的数据。

jquery ajax问题，堆叠div

2 个答案: