javascript表单的动态验证

javascript表单的动态验证,javascript,Javascript,我有这张表格 <form name="myForm" action="" method="post" onsubmit="return validations(this)" > <span> <label>Enter Your First Name</label><input id="name" name= "field[1]" type="text" class="element text" m

我有这张表格

<form name="myForm" action="" method="post" onsubmit="return validations(this)"  >


        <span>
            <label>Enter Your First Name</label><input id="name" name= "field[1]" type="text" class="element text" maxlength="255" size="8" value=""/>
        </span>
        <br /><br />
        <span>
            <label>Enter Your Last Name</label><input id="last" name= "field[2]" type="text" class="element text" maxlength="255" size="8" value=""/>

        </span> 
        <br />
        <br />

        <span>
            <input id="field[3]" name="field[3]" class="element radio" type="radio" value="1" />
<.label class="choice" for="field[3]">Male</label>
<input id="field[4]" name="field[4]" class="element radio" type="radio" value="2" />
<label class="choice" for="field[4]">Female</label>

        </span> 
        <br /><br />
        <label class="description" for="field[5]">Enter your city </label><input id="field[5]" name="element_3" type="text" class="element text medium" type="text" maxlength="255" value=""/> 

        <br /><br />
        <span>
            <input id="field[5]" name="field[5]" class="element checkbox" type="checkbox" value="1" />
<.label class="choice" for="field[5]">I am unemployed.</label>
<br /><br />

        </span> 

                <input type="hidden" name="form_id" value="form1" />
</div>              
.               
<.input type="submit" value="Validate" >



        </form> 

输入您的名字


输入您的姓氏

男性 女性

进入你的城市

我失业了。

.
我想在单击“验证”时验证表单。检查所有字段type=text是否已完成。如何动态执行此操作?

您可以使用

  • 纯JavaScript检查、编写函数并在单击submit按钮时验证每个字段
  • 如果您正在使用jQuery,请使用jQuery验证插件。在html页面中包含jQuery和jQuery验证插件,将class=“required”添加到文本字段,最后添加JavaScript代码以附加验证
  • 第二个很简单,因为它只需要调用validate函数并为文本字段设置class=“required”

    例:

    在html头标签中包含jQuery和验证插件

    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js" type="text/javascript"></script>
    
    
    
    若要将验证附加到表单,请在标题部分或正文中的任何位置添加此代码

    <script type="text/javascript">
    jQuery(document).ready(function($){
      $('form[name="myForm"]').validate();
    });
    </script>
    
    
    jQuery(文档).ready(函数($){
    $('form[name=“myForm”]')。验证();
    });
    
    现在,您的表单字段:

    <form name="myForm" action="" method="post">
      <input type="text" class="required" name="..." ...>
      or simply
      <input type="text" name="..." required>
      .... all other fields
    </form>
    
    
    或者干脆
    .... 所有其他领域