頁面重新加載後，即使在返回false後在ajax $ .post請求

我想上傳圖像表單提交後使用ajax調用，有一個問題，討厭我，新的FormData($(this)[0])給我的實際值，但每當我嘗試發送它通過阿賈克斯其故障並重新加載頁面，所以我不能看到控制檯，請糾正我在哪裏我錯了。

我的JavaScript代碼

$("#editImage").submit(function(){ 
var data = new FormData($(this)[0]); 
console.log(data); 
return false; 
$.post("../galImages", data).done(function(response){ 
    console.log(response); 
}); 
return false;});

我的HTML代碼

<form name="edit-image" id="editImage" action="" method="post" enctype="multipart/form-data"><input type="file" name="change-image" accept="image/*" class="form-control mb-20" value="Upload Image"> 
        <input type="hidden" name="edit-img-id" id="editImageId"><input type="submit" class="btn btn-primary" value="Save Changes" id="submitEditImgForm"></form>

但文件的數據都是張貼在PHP頁面，還有一件事我怎麼能一起發送隱藏字段值與formdata對象。我是ajax $.post方法的noobie。如果有人有任何想法，請幫助我。

來源

2017-04-14 Rajesh Dey

jQuery'.submit'你應該防止處理表單/數據的默認行爲？表單（目標網址）呢？ – OldPadawan

@OldPadawan我已經更新了html部分 –

然後，我猜[preventDefault]（https://api.jquery.com/event.preventdefault/）會這樣做 – OldPadawan

當你上傳一張圖片（我的失誤，忘了先！）：重要的部分是那些否則將無法

$(function() { 
$('#my_form').on('submit', function (e) { 
    e.preventDefault(); 

    var $form = $(this); 
    var formdata = (window.FormData) ? new FormData($form[0]) : null; 
    var data = (formdata !== null) ? formdata : $form.serialize(); 

    $.ajax({ 
     url: $form.attr('action'), 
     type: $form.attr('method'), 
     contentType: false, // needed for upload 
     processData: false, // needed for upload 
     dataType: 'json', // return 
     data: data, 
     success: function (response) { 
      // response 
     } 
    }); 
    }); 
});

此代碼是不是我的，發現它，適應它很久以前，不能信任它的原始主人，因爲我不記得他/她是誰：/

來源

2017-04-14 18:58:57 OldPadawan

非常感謝你，它的工作原理，你只需要節省很多時間.. –

UR歡迎。對未來有好的代碼，對於'給'我們這部分代碼並不會得到好評的夥伴感到遺憾...... – OldPadawan

使用preventDefault()這將防止窗體和頁面重新加載的默認行爲。

$("#editImage").submit(function (e) { 
    e.preventDefault(); 
    var data = new FormData($(this)[0]); 
    console.log(data); 
    return false; 
    $.post("../galImages", data).done(function (response) { 
     console.log(response); 
    }); 
    return false; 
});

來源

2017-04-14 18:42:21 julekgwa

謝謝@julekgwa，看起來像它的工作，頁面停止重新加載，但在console.log，「非法調用」，有一個錯誤，防止頁面發送數據到目標php文件 –

頁面重新加載後，即使在返回false後在ajax $ .post請求

回答

相關問題