Question

我有一个按钮触发的以下JS功能：

function uploadPicture( ) {
    $("form#pictureUpload").ajaxSubmit({
        data: $("form#pictureform").serialize(),
        type: 'post',
        url: '?action=loadpicture',
        success: function(response) {
            $('#div-pictures').html(response);
        }
    });

}

这几个月完美无缺。但它今天在Firefox，Safari，Chrome和Opera中停止了工作 - 尽管它仍能在Internet Explorer中正常运行。

Safari给了我以下神秘错误：

    Failed to load resource: cancelled       ?action=loadpicture

Chrome输出几乎相同（没有: cancelled）。 Opera和Firefox完全没有错误。唯一的附加信息是上述错误发生在文件上传完成后，尽管服务器生成HTML输出作为反馈，浏览器会忽略它。

如果你有任何想法如何解决这个问题，请告诉我。我已经在圈子里运行了几个小时甚至没有接近解决方案 - 我只是看到代码和日志文件中没有错误。非常感谢！

Answer 1

我花了一段时间，但我终于明白了。我们的一位管理员添加到Apache配置中：

Header append X-FRAME-OPTIONS "DENY"

由于http://jquery.malsup.com/form/#file-upload中描述的iframe用法，导致某些浏览器出现问题。将其更改为以下内容后，所有内容都会再次运行（无代码更改！）：

Header append X-FRAME-OPTIONS "SAMEORIGIN"

无论如何，Safari＆amp;上的错误消息Chrome很神秘。在其他浏览器上没有任何错误消息的奇怪行为更糟糕。

Answer 2

嗯，你不应该在URL中使用查询字符串，因为当你调用序列化时，它会将数据转换成一个查询串起来试试这个：

$("form#pictureUpload").ajaxSubmit({
        data: 'action=loadpicture&'+$("form#pictureform").formSerialize(),
        type: 'post',
        success: function(response) {
            $('#div-pictures').html(response);
        }
    });

JavaScript：ajaxSubmit错误

2 个答案: