jQuery 在 IE11 中不起作用，但在 Chrome 中有效

Question

我有 jQuery 的問題。 當我在 Chrome 中上傳圖像時，它會成功執行 AJAX，並且我能夠使用響應數據更新頁面。 但在 IE 11 和 Firefox 中則不然。 編碼：

$(".newfoto").on('submit', (function(e) {
    $("#mailresult").html('<img src="themes/standart/iconss/spin1.gif" alt="loading..." /><p>Please, wait...</p>');
    e.preventDefault();
    $.ajax({
        url: "dataok.php?act=foto",
        type: "POST",
        data: new FormData(this),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            $("#mailresult").html(data);
            setTimeout(function() {
                $("#mailresult").empty();
            }, 2000);
            var imgTag = '<img src="image.php?imgid=' + escape($('.myphoto').attr('id')) + '" />';
            $('.myphoto').html(imgTag);
        },

        error: function() {}

    });
}));

Answer 1

防止表單提交和重新加載頁面的正確方法是使用return false; 在提交函數的最后。 這也將取代e.preventDefault(); 在你的代碼中。

此外，並非所有瀏覽器都支持FormData 。 請參閱https://stackoverflow.com/a/2320097/584192 。 您可能需要檢測並解決此問題。

$(".newfoto").on('submit', function(e) {
    $("#mailresult").html('<img src="themes/standart/iconss/spin1.gif" alt="loading..." /><p>Please, wait...</p>');
    $.ajax({
        url: "dataok.php?act=foto",
        type: "POST",
        data: (typeof FormData === 'function') ? new FormData(this) : $(this).serialize(),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            // success
        },
        error: function(jqXHR, status, error) {
            console.log(error);
        }
    });
    return false;
});