Jquery 如何仅在填写了表单的所有字段后才提交表单

我有下面的函数来检查字段。我只想在所有字段都不是空的情况下提交

function validateAdminInput() {

    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
        }else{
             $(this).css('border','');
        }
    });

    $('#addproducts_form').submit();

}

---

您可以使用一些jquery验证插件。它将允许以多种方式进行验证。

在表单标记中，写入

onsubmit="return checkmyform(this);"

并在标记后添加以下内容：

function checkmyform(form){
   var $myform = $(form);
   $(".mand",myform).each(function(){
      if($(this).name()=="input"){
          if($.trim($(this).val())=="") return false;
      }else{
          if($.trim($(this).text())=="") return false;
      }
   });
   return true;
}

---

像这样的东西对你有帮助吗

 function validateAdminInput() {
        var check = false;
        $('.mand').each(function() {
            if ($(this).val() == '') {
                check = true;
                $(this).css('border','solid red 1px');
            }else{
                 $(this).css('border','');
            }
        });

      if(!check)
      {
      // your code
      }

    }

---

如果我了解您的功能，这应该可以做到：

function validateAdminInput() {

    var allValid = true;

    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
            allValid = false;
        }else{
             $(this).css('border','');
        }
    });

    if (allValid)
        $('#addproducts_form').submit();

}

---

您可以向所有字段添加

required

属性，但这仅适用于支持HTML5表单的浏览器

对于其他人来说，这很容易：

<form action="..." method="..." onSubmit="return validate(this);">
    <!-- input fields here -->
</form>

---

请注意，此解决方案采用原始JS，因此保证比任何jQuery解决方案快很多倍。

这确实是一个巧妙的解决方案！我从未想过使用标志（

var errors

）。

 function validateAdminInput() {
        var check = false;
        $('.mand').each(function() {
            if ($(this).val() == '') {
                check = true;
                $(this).css('border','solid red 1px');
            }else{
                 $(this).css('border','');
            }
        });

      if(!check)
      {
      // your code
      }

    }

function validateAdminInput() {

    var allValid = true;

    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
            allValid = false;
        }else{
             $(this).css('border','');
        }
    });

    if (allValid)
        $('#addproducts_form').submit();

}

<form action="..." method="..." onSubmit="return validate(this);">
    <!-- input fields here -->
</form>

<script type="text/javascript">
    function validate(form) {
        var inputs, len, i;
        if( document.querySelectorAll) {
            inputs = form.querySelectorAll('input[required], select[required], textarea[required]');
        }
        else {
            inputs = [];
            var tags = ['input','select','textarea'], tag, elms;
            while( tag = tags.shift()) {
                elms = form.getElementsByTagName(tag);
                len = elms.length;
                for( i=0; i<len; i++) if( elms[i].getAttribute("required")) inputs.push(elms[i]);
            }
        }
        len = inputs.length;
        for( i=0; i<len; i++) {
            if( inputs[i].value == '') {
                alert("Please fill out all fields");
                // customise error stuff here
                return false;
            }
        }
        return true;
    }
</script>