jQuery ajax多行“script”响应

Question

我正在设计一个模板创建工具，它使用jQuery Ajax请求将参数发布到PHP文件。PHP实际生成模板的HTML。

// Send for processing. Expect JS back to execute.
function generate() {
$.ajax({
    type: "POST",
    url: "generate.php",
    data: $('#genform :input').serialize(),
    dataType: "script",
    beforeSend: function() {
        $("#loading").html("<img src='images/loadbar.gif' />");
        $("#loading")           
        .dialog({
            height: 80,
            width: 256,
            autoOpen: true,
            modal: true
        });
    },
    success: function(data) {
        $("#loading").dialog('close');
    }
});
}

我的问题在于我将ajax的dataType设置为“script”，使用这个设置，PHP文件可以生成一些jQuery对话框来处理错误，效果很好。然而，在我生成HTML后，我遇到了传递回去的问题。

所以，我有大约100行生成的HTML和javascript需要处理。在PHP文件中，我尝试过：

echo('$("#result").html("'.$html.'");');

如果$html中没有换行符，这确实可以正常工作。一旦有任何换行符，Chrome调试器就会报告“gen.html:1 Uncaught SyntaxError: Unexpected token ILLEGAL”。很明显它正在尝试评估返回的响应头，但在任何换行符处停止。

因此，要明确，当我传回$html时，如果内容是这样的：

$html = "<div>hi there</div>";

它运行良好（我所有的错误消息对话框都是一行）。但如果它是：

$html = "<div>
           hi there
         </div>";

它爆炸了。

我真的不确定如何解决这个问题，或者是否有更好的方法。对我来说保留格式很重要，这样人们就可以复制HTML模板。

如果我无法解决这个问题，我可能会在PHP页面上显示模板文件，但我真的希望将所有内容都保留在HTML页面中。

- Rendrik

Answer 1

另一种简单的方法（类似于xml解决方案）是使用编码为对象的JSON响应。这在jQuery中自然得到支持，它实际上还会为您解码JSON。具体步骤如下：

1. 将 dataType: "script" 替换为 datatype: "json"
2. 更改成功函数以执行HTML替换。
3. 将PHP更改为简单输出 json_encode($html);

这是更改后的成功函数。

success: function(data) {
    $("#loading").dialog('close');
    $("#result").html(data.result_html);
}

以下是修改后的PHP函数：

这里是修改后的PHP函数：

echo json_encode(array('result_html' => $html));

我建议不直接输出HTML，这样你可以在未来为JSON输出添加额外数据。但是，你也可以使用PHP中的echo json_encode($html)，然后用$("#result").html(data);来简单地输出HTML。

- phsource

Answer 2

您可以将dataType更改为“text”或“xml”，以便响应不被评估。

dataType: ($.browser.msie) ? "text" : "xml",

- Dave

---

那肯定是一种方法，但我会根据是否出现错误（显示对话框）或模板是否显示（$（“#result”）。html（“…”）;）执行不同的操作。如果我只是回显所有响应，我就失去了这种控制。 - Rendrik

为了解决这个问题，你可以处理异常并输出实际的HTTP错误（使用头文件），这将作为XHRError发送回您的ajax调用，您可以轻松处理。 - FilmJ

我还没有探索过这个，但听起来不错。所以基本上如果有问题，我可以自己编写HTTP头部（我想它们只能到505？）。然后，如果我理解正确，我会添加“complete”ajax回调，因为它获取XMLHttpRequest对象（我想），然后从那里开始？ - Rendrik

Answer 3

尝试创建输出处理程序函数：

function ob_handler($string, $flags) {
    return nl2br($string);
}

或者：

function ob_handler($string, $flags) {
    $string = str_replace(array("\r", "\n"), array('', ''), $string);
    return $string;
}

然后在你的代码中使用它：

ob_start('ob_handler');
/// all your code here
ob_end_flush();

- Dmytro Zavalkin

Answer 4

你必须转义所有可能破坏 JavaScript 代码的内容：

$html = str_replace(array('\\', "\r", "\n", '"'), array('\\\\', '\r', '\n', '\"'), $html);

echo('$("#result").html("'.$html.'");');

- Marek