用于验证空输入字段不起作用的 JS 函数

JS function to validate for null input fields not working

本文关键字：JS 函数 不起作用 字段 验证 输入 用于      更新时间：2023-09-26

我似乎无法弄清楚我的JS出了什么问题。我所需要的只是函数validateForm来检查表单上的空字段id formId我从来没有在浏览器上收到警报。

这是我的JS：

<script>
    $(document).ready(function(){
        window.validateForm = validateForm;
        function validateForm(formId){
        var form=document.getElementById('#formId');
        for(i=0; i<form.childNodes.length; i++)
            if(form.childNodes[i].tagName!='INPUT'||
               typeof form.childNodes[i].value=="undefined")
                continue;
            else{
                var x=form.childNodes[i].value;
                if(x==null||x==""){
                    alert("please fill out all fields");
                    return false;
                }
            }
    }
 </script>

这是 html：

  <form id="formId" name="myForm" action="mailto:" onsubmit="return validateForm()" method="post">
  first field: <input type="text" name="first"></br>
  second field: <input type="text" name="second"></br>
  third field: <input type="text" name="third"></br>
  fourth field: <input type="text" name="fourth"></br>
  <input type="submit" value="Submit">

请检查此小提琴以查看它的实际效果 http://jsfiddle.net/thefourtheye/p9pDu/1/

代码中需要进行四项更改

  1. 像这样更改表单的定义

    <form id="formId" name="myForm" action="mailto:" method="post">

  2. 您的validateForm函数不需要任何参数。

  3. 当您使用document.getElementById时，请勿使用 # 。所以，它应该是

    document.getElementById('formId')

  4. 您只需要此行即可确保在提交表单时调用validateForm。

    $('#formId').on('submit', validateForm);

validateForm函数在文档就绪回调中定义（在回调函数作用域中）。这将无法在全球范围内访问。但是您正在尝试访问 onsubmit 事件中的函数。

在回调函数中的函数定义之后执行此操作，以使函数全局可用：

window.validateForm = validateForm;
相关文章：