由于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提交表单无法正常工作

回答

相关问题