JavaScript: ajaxSubmit lỗi

Question

Tôi đã chức năng JS sau kích hoạt bởi một nút:

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

}

này làm việc hoàn toàn tốt đẹp trong vài tháng. Nhưng nó đã ngừng hoạt động ngày hôm nay trong Firefox, Safari, Chrome và Opera - mặc dù nó vẫn hoạt động chính xác trong Internet Explorer.

Safari mang lại cho tôi những lỗi bí ẩn sau:

Failed to load resource: cancelled  ?action=loadpicture 

Chrome kết quả đầu ra gần như giống nhau (không có : cancelled). Opera và Firefox không có lỗi gì cả. Thông tin bổ sung duy nhất là các lỗi ở trên xảy ra sau khi quá trình tải tệp lên hoàn tất và mặc dù máy chủ tạo ra đầu ra HTML làm phản hồi bị trình duyệt bỏ qua.

Vui lòng cho tôi biết nếu bạn có bất kỳ ý tưởng nào về cách khắc phục sự cố này. Tôi đã chạy trong vòng tròn trong nhiều giờ mà thậm chí không đến gần với một giải pháp - Tôi chỉ đơn giản là không thấy lỗi trong mã cũng như trong các tệp nhật ký. Cảm ơn nhiều!

Answer 1

Nó đã cho tôi một thời gian, nhưng tôi cuối cùng tìm ra. Một trong những quản trị viên của chúng tôi thêm vào cấu hình Apache:

nào gây ra một vấn đề trên trình duyệt nhất định vì việc sử dụng iframe mô tả ở http://jquery.malsup.com/form/#file-upload. Sau khi thay đổi nó vào tất cả mọi thứ sau đây được hoạt động trở lại (không có thay đổi mã!):

Header append X-FRAME-OPTIONS "SAMEORIGIN" 

Dù sao, các thông báo lỗi trên Safari & Chrome là khó hiểu. Các hành vi lạ mà không có bất kỳ thông báo lỗi trên trình duyệt khác thậm chí còn tồi tệ hơn.

Answer 2

Hmmm bạn không nên sử dụng các chuỗi truy vấn trong URL vì khi bạn gọi serialize đi của nó để có được lần lượt các dữ liệu vào một truy vấn xâu thành chuỗi thử này:

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