jquery - iframe 文件上传或 jquery 正在转义我的字符串

Question

我正在编写一个 javascript&jquery-backend 并使用 iframe 文件上传的标准 ajax meme。

我们需要使用 javascript eval() (是的，我知道)在服务器返回的字符串上。字符串可能是这样的(但并不总是这样，所以我们确实需要 eval):

$("#uploaderCinfo").html("<h1>file(s) received</h1>");

服务器、firebug、fiddler 告诉我这正是它发送的内容(加上 http header ):

HTTP/1.1 200 OK
Content-Type: text/plain
Content-Length: 54

$("#uploaderCinfo").html("<h1>file(s) received</h1>");

但是我从 iframe 得到的是这样的:

<pre>$("#uploaderCinfo").html("&lt;h1&gt;file(s) received&lt;/h1&gt;");</pre>

我认为 <pre>'s 是有充分理由的。添加，我可以使用 slice() 删除它们。但是 html 字符串中的转义从何而来？

这边 <h1>file(s) received</h1> 被逐字添加到页面中，因为 < 被以某种方式转义了。 我可以阻止转义还是必须使用 javascript-means 来恢复它？

感谢您的帮助。

供引用:最小可用源如下:(注意:单引号转义到生成 session 的 Smalltalk 中)

self plain: '<div id="uploadform',uUpload,'">
    <form id="theuploadform',uUpload,'" method="post" action="">
        <input id="userfile',uUpload,'" name="userfile',uUpload,'" 
            size="10" type="file" multiple />
        <input id="formsubmit',uUpload,'" type="submit" value="upload" 
            onClick="', INSIDE THE ONCLICK (see below) ,'" />
    </form>
<span id="anim',uUpload,'">
</span>
<div id="iframe',uUpload,'" style="width: 0px; height: 0px; display: none;">

INSIDE THE ONCLICK:

$("#anim',uUpload,'").html("<img src=''/files/public/loading.gif'' />");
var iframe = $(''<iframe name="postiframe',uUpload,'" 
        id="postiframe',uUpload,'" style="display: none" />'');
    $("body").append(iframe);
    var form = $("#theuploadform',uUpload,'");
    form.attr("action", "/uploadAjax?session=',
        (session at: #zId),'&upload=',uUpload,'");
    form.attr("method", "post");
    form.attr("target", "postiframe',uUpload,'");
    form.attr("enctype", "multipart/form-data");
    form.attr("file", $("#userfile',uUpload,'").val());
    form.submit();
    $("#postiframe',uUpload,'").load(function () {
        iframeContents = 
            $("#postiframe',uUpload,'")[0].contentWindow.document
                                                    .body.innerHTML;
        $("#anim',uUpload,'").html(""); /*removes animation*/
    console.log("A");
    console.log(iframeContents);
    console.log("B");
    iframeContents = iframeContents.slice(5, iframeContents.length-6);
    console.log(iframeContents);
    console.log("C");
    eval(iframeContents);
    console.log("D");
    });
    return false;

Answer 1

我认为这确实不是服务器转义的，而是你的浏览器转义的。它添加了 <pre>因为它的内容是文本/纯文本(就像 @Pinal 已经建议的那样)。

我对你使用 FF 的看法正确吗？ (编辑:我刚刚在这里找到了错误报告:https://bugzilla.mozilla.org/show_bug.cgi?id=674186)

尝试使用.textContent从 iframe 检索内容时而不是innerHTML。

另请参阅http://www.quirksmode.org/dom/w3c_html.html#t07建议使用 var text = x.innerText || x.textContent为了浏览器兼容性。