Question

我修改了此脚本http://jsfiddle.net/mblase75/xtPhk/1/以提交表单。目标是在所有表单字段都经过验证之前禁用“提交”按钮。这在第一次工作正常但是因为，我的表单没有动作jquery也处理提交。

因此，在我提交表单后，提交按钮不会被禁用。我必须刷新页面才能禁用它。

我想要做的是，在每个帖子之后......提交按钮应该被禁用，而不刷新页面。

这可能吗？

如果我的表单有一个操作页面，它确实有用。但我不想要那个

表格提交：

       $(document).ready(function() {
    $("#paForm").submit(sendForm)
    });

   function sendForm() {
      $.post('pa_submit.cfm',$("#paForm").serialize(),function(data,status){
    $("#result").html(data)
});// end of submit 
$( '#paForm' ).each(function(){
      this.reset(); // end of reset 
  });
return false
  }

禁用提交按钮，直到所有字段都经过验证

       $(document).ready(function() {
       $form = $('#paForm'); // cache
       $form.find(':input[type="submit"]').prop('disabled', true); // disable submit btn
      $form.find(':input').change(function() { // monitor all inputs for changes
    var disable = false;
       $form.find(':input').not('[type="submit"]').each(function(i, el) { // test all inputs for values
            if ($.trim(el.value) === '') {
            disable = true; // disable submit if any of them are still blank
           }
        });
         $form.find(':input[type="submit"]').prop('disabled',disable);
      });
    });

我正在使用jquery函数将我的值发布到数据库。我的表格没有动作。

http://jsfiddle.net/bC6GF/

这是jsfiddle页面，它显示了我的问题。

Answer 1

为什么不在提交后禁用按钮？

您已经有提交功能：

function sendForm() {
 $.post('pa_submit.cfm',$("#paForm").serialize(),function(data,status){
  $("#result").html(data)
 });// end of submit 
 $( '#paForm' ).each(function(){
  this.reset(); // end of reset 
 });
 return false;
}

通过调用提交按钮进行扩展以禁用它：

function sendForm() {
 $.post('pa_submit.cfm',$("#paForm").serialize(),function(data,status){
  $("#result").html(data)
 });// end of submit 
 $( '#paForm' ).each(function(){
  this.reset(); // end of reset 
 });
 $("#paForm").find(':input[type="submit"]').prop('disabled', true); 
 return false;
}

这应该在每次提交后禁用按钮。

不相关但你可能想要研究的是jQuery JavaScript Style Guides并清理你的一些代码。

禁用表单提交，直到使用jQuery验证字段

1 个答案: