如何从ajax调用返回值以及HTML结果?

时间:2011-01-29 17:05:58

标签: php javascript jquery ajax

我的jquery代码为

 $(function() {
    $("#addline").click(function() {
        $.ajax({
            type: "POST",
            url: "proc/add-line.php",
            data: // some string,
            cache: false,
            success: function(html){
                $("ul#nextLines").append(html);

                if(lineId == 10) {                // lineId value to be passed from add-line.php
                    $("#addForm").hide();
                }
            }
        });
        }return false;
    }); 
});

在注释为“// lineId将从add-line.php传递”的行中[参考上面的代码],我希望php处理页面add-line.php传递var lineId的值。 / p>

目前,add-line.php提供了一个html代码<li><?php echo $line; ?></li>。除此之外,我想发送lineId的值,以便我可以实现这种条件化。

那么我该如何从add-line.php发送然后检索lineId的值(以PHP变量的形式检索)?

更新

我已将上面的代码更改为

$.ajax({
                type: "POST",
                url: "proc/add-line.php",
                data: dataString,
                dataType: 'json',
                cache: false,
                success: function(data){
                    alert(data.html);
                    $("ul#nextLines").append(data.html);
                    $("ul#nextLines li:last").fadeIn("slow");
                    $("#flash").hide();

                    if(data.lineId == 10) {
                        $("#addForm").hide();
                    }
                }

            });

PHP代码

    // Header type
    header('Content-Type: application/json; charset=utf-8');
    $data = array(
        "html"=> "test",
        "lineId" => "1" 
    );

    echo json_encode($data);

我无法找回json。 (即使成功函数调用中的alert(data.html)也没有显示出来。)

你可以帮我解决这个问题吗?感谢。

2 个答案:

答案 0 :(得分:3)

一种选择是使用JSON返回json_encode

$data = array('html'=> "<li>$line</li>",
    'lineId' => $lineId //wherever that comes from
);

echo json_encode($data);

JavaScript的:

$.ajax({
        type: "POST",
        url: "proc/add-line.php",
        data: // some string,
        dataType: 'json',
        cache: false,
        success: function(data){
            $("ul#nextLines").append(data.html);

            if(data.lineId == 10) {
                $("#addForm").hide();
            }
        }
});

答案 1 :(得分:1)

两种解决方案:

从PHP脚本返回JSON:

// In PHP:
header('Content-Type: application/json; charset=utf-8');
echo json_encode(array(
    'html' => '<li>' . intval($lineId) . '</li>',
    'lineId' => $lineId,
));

// In JS:
success: function(json){
    var lineId = json.lineId;
    var html = json.html;
    // ...
}

由于Content-Type标头设置为application / json,jQuery会自动将结果解析为JSON。所以成功回调的第一个参数是解析的JSON对象。

或者在HTTP标头中返回lineId:

// In PHP
header('X-LineId: ' . $lineId);

// In JS
success: function(html, textStatus, xhr){
    var lineId = xhr.getResponseHeader('X-LineId');
    // ...
}