JQuery从Ajax响应中更新多个元素

时间:2014-04-25 19:27:58

标签: jquery ajax

我有一个Ajax请求,它返回一个HTML响应。

我想用DOM替换带有新内容的相应ID的现有DIV。

我相信这种方法就像这里概述的那样:

Update multiple elements with html from jquery ajax call

这是我最初的DOM:

<a onclick="ajaxTest();">Test</a>
<div id="x">
 xxx
</div>
<div id="y">
 yyy
</div>

这是回复:

<div id="response">
    <div id="x" class="room">111</div>
    <div id="y" class="room">222</div>
</div>

这是JS。

function ajaxTest(){
    // UPDATE ON SERVER
    $.post("secure/admin/allocateRoom.do", {
        bookingId : 3051,
        roomId : 2291,
        success : function(data) {
            var $response = $(data);
            $response.children().each(function() {
                alert('in');
                $('#' + this.id).html(this.innerHTML);
            });
        }
    });
}

现在可以使用以下请求:

$.post("secure/admin/allocateRoom.do", {
    bookingId : bookingId,
    roomId : roomId
}, function(html) {
    var $response = $(html);
    $response.children().each(function() {
        if (this.id) {
            $('#' + this.id).replaceWith(this);
        }
    });
});

1 个答案:

答案 0 :(得分:0)

试试这个;

success : function(data) {
    var $response = $(data);
    $response.children().each(function(){
        if (this.id) {
            $('#'+this.id).replaceWith(this);
        }
    });
}

DEMO