1

更改输入后,我无法触发表单提交。我想我需要事件处理,但我从来没有真正了解过那是什么。

这是我的 HTML:

<form action="/upload">
  <input type="file" name="file">
</form>

这是我的 JS:

$('input').change(function(e){
var closestForm=$(this).closest("form");
    closestForm.submit(function(e) {   
  closestForm.ajaxSubmit({   
              success: function(data){
                    console.log('form submitted successfully');
              }
      }); //ajaxSubmit
    return false;
  }); //submit 
}); //change

请注意,我想使用 AJAX 进行提交,但这不是问题,因为我的代码库的其他部分可以使用jQuery Form 插件 ajaxSubmit()没问题。

想法?

4

3 回答 3

2

由于您希望在输入更改时提交表单。您不需要在表单上提交事件

 $('input').change(function(e){
    var closestForm=$(this).closest("form"); 
      closestForm.ajaxSubmit({   
                  success: function(data){
                        console.log('form submitted successfully');
                  }
          }); //ajaxSubmit
        return false; 
    }); //change
于 2012-09-27T20:36:33.253 回答
0

您可以尝试“锁定”表单提交,直到填写该字段,如下所示:

var form_locked = true;

$("input").change(function(e){
    if($(this).val() == "") {
        form_locked = true;
    }else{
        form_locked = false;
    }
});

$("form").submit(function(e) {

    // prevent default form submit
    e.preventDefault();

    if(form_locked) {
        alert("Please fill in the field!");
    }else{
        // Do your form submission stuff here
    }

});
于 2012-09-27T20:40:08.453 回答
0

在收到导致以下 SO Q&A 的错误消息后,我解决了自己的问题。jQuery 表单插件 - 文件上传时未捕获的类型错误

我的错误消息与此类似:

jquery.form.js:357 Uncaught TypeError: 
Object function (a,b){return new d.fn.init(a,b,g)} has no method 'handleError' 

基本上,只要我下载了最新的 jQuery Form 插件 js 文件,我就能够消除该submit()功能并ajaxSubmit()按照@Shusl 的建议使用。

特别感谢@Shusl 让我走上正轨。

于 2012-09-27T20:50:55.983 回答