由於JS提交表單無法正常工作

我使用文件上傳（圖像）形式，並且我想將這些圖像限制爲500KB大小。然而，現在這些表格並沒有提交和idk爲什麼。這是jQuery中的代碼由於JS提交表單無法正常工作

$('form').on('submit', function(e) { 
e.preventDefault(); 
}); 


$('input:file').change(
function(e) { 
    var files = e.originalEvent.target.files; 
    for (var i=0, len=files.length; i<len; i++){ 
     var n = files[i].name, 
      s = files[i].size, 
      t = files[i].type; 

     if (s > 500000) { 

      $('.submit-btn1').click(function(){ 

       alert('Please deselect this file: "' + n + '," it\'s larger than the maximum filesize allowed (500KB). Sorry!'); 
       return false; 
      }) 

     } 
    } 
}) 

$('input:file').change(
function(e) { 
    var files = e.originalEvent.target.files; 
    for (var i=0, len=files.length; i<len; i++){ 
     var n = files[i].name, 
      s = files[i].size, 
      t = files[i].type; 

     if (s > 500000) { 

      $('.submit-btn2').click(function(){ 

       alert('Please deselect this file: "' + n + '," it\'s larger than the maximum filesize allowed (500KB). Sorry!'); 
       return false; 
      }) 

     } 
    } 
})

這些是2種不同的形式。它昨天工作，但現在它不起作用。當我刪除e.preventDefault（）;它的工作原理，但問題是，一旦我上傳大於500KB的圖片，消息彈出並且我不能提交表單（這很好），我將圖片更改爲小於500KB，當我嘗試再次提交時仍然彈出消息。它看起來像我第一次上傳的圖片大於500KB仍在使用，如果我上傳一個常規圖片，則無關緊要。

請幫忙。

來源

2017-03-17 grabnem

從你一個代碼塊，我看你是防止形式被提交。刪除'e.preventDefault（）' –

在校正文件大小後仍然看到錯誤的原因是因爲點擊處理程序仍然被註冊。如果你想保持這種格式，點擊處理程序在變更處理程序中註冊的地方，你還需要一個else語句，說應該關閉點擊處理程序。

我希望能有一個更破舊的解決方案，在那裏你定義一個標誌變量，如fileSizeAcceptable，它開始了作爲true，然後切換到false變化處理程序中，如果文件過大，集到true如果它不是太大。然後，在您的點擊處理程序中，在提交表單之前檢查該值。

這些方針的東西：

var fileSizeAcceptable = true; 

$('input:file').change(function(e) { 
    var files = e.originalEvent.target.files; 
    for (var i=0, len=files.length; i<len; i++){ 
     var n = files[i].name, 
      s = files[i].size, 
      t = files[i].type; 

     if (s > 500000) { 
      fileSizeAcceptable = false; 
     } else { 
      fileSizeAcceptable = true; 
     } 
    } 
}) 

$('.submit-btn1').click(function(){ 
    if (!fileSizeAcceptable) { 
     alert('Please deselect this file: "' + n + '," it\'s larger than the maximum filesize allowed (500KB). Sorry!'); 
     return false; 
    } 
})

來源

2017-03-17 13:15:02

在你的代碼，你從來沒有讓形式提交。的「上傳」行動的終點總是停在

$('form').on('submit', function(e) { 
e.preventDefault(); 
});

我已經改變了你的邏輯和文件驗證順序，確定一個標誌，將檢查文件是否超過限制更大的FINALY作出決定提交表格或不提交。

檢查this codepen，我希望你能理解你的問題:)

來源

2017-03-17 13:23:05

由於JS提交表單無法正常工作

回答

相關問題