使用一个AJAX响应更新两个div

时间:2012-01-24 14:07:26

标签: php ajax json jquery

全部, 我正在使用jQuery / AJAX来调用文件,基本上可以保存某人喜欢的歌曲。我正在尝试做类似以下的事情:

var html = $.ajax({
type: "POST",
url: "save_song.php",
data: "song_id=" + song_id + "&love_like_hate=hate",
async: false
}).responseText;

$("#div_song_id_"+song_id).html(responseText1);
$("#love_it").html(responseText2);

然后在PHP方面有这样的事情:

echo "This text would go in response text 1";
echo "This text would go in response text 2";

所以基本上我试图在save_song.php文件中有多个echo,然后基本上说第一个echo进入第一个div而第二个echo进入需要更新的第二个div。知道怎么做吗?

2 个答案:

答案 0 :(得分:4)

我会用json做到这一点。如果你在php中回显一个关联数组并且json对它进行编码,jQuery会自动将json字符串转换为一个对象。

或者你可以使用某种分隔符(如|&*etc...)回显两个语句,然后用javascript分割它,但我认为这是一种更简洁的方法。

//php
echo json_encode(array(
    "responseText1" : "This text would go in response text 1",
    "responseText2" : "This text would go in response text 2"
))

//javascript
$.ajax({
    type: "POST",
    url: "save_song.php",
    dataType: "json",
    data: "song_id=" + song_id + "&love_like_hate=hate",
    success:function(val){
        $("#div_song_id_"+song_id).html(val.responseText1);
        $("#love_it").html(val.responseText2);

    }
});

答案 1 :(得分:2)

您的PHP代码可以返回JSON字符串:

<?php
    echo json_encode(array(
        'test1' => 'This text would go in response text 1',
        'test2' => 'This text would go in response text 2'
    ));
?>

然后你可以在jQuery中解析它:

$.ajax({
    type: "POST",
    url: "save_song.php",
    data: "song_id=" + song_id + "&love_like_hate=hate",
    dataType: 'json',
    async: false,
    success: function(response) {
        if (response && response.text1 && response.text2) {
            $("#div_song_id_"+song_id).html(response.text1);
            $("#love_it").html(response.text2);
        }
    }
});