jQuery.validate验证时用的是Form输入表单的name属性

最新推荐文章于 2018-08-22 08:36:24 发布
最新推荐文章于 2018-08-22 08:36:24 发布
阅读量926 收藏
点赞数

例如：

[html]  view plain  copy
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <title>test</title>  
  5. <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />  
  6. <meta http-equiv="Cache-Control" content="no-store" />  
  7. <meta http-equiv="Pragma" content="no-cache" />  
  8. <meta http-equiv="Expires" content="0" />  
  9.    
  10. <link href="/static/jquery-easyui/1.2.6/themes/default/easyui.css"  
  11.     type="text/css" rel="stylesheet">  
  12. <link href="/static/jquery-easyui/1.2.6/themes/icon.css"  
  13.     type="text/css" rel="stylesheet">  
  14. <link href="/static/style/demo.css" type="text/css"  
  15.     rel="stylesheet">  
  16. <link href="/static/jquery-validation/1.9.0/milk.css"  
  17.     type="text/css" rel="stylesheet" />  
  18.    
  19. <script src="/static/jquery/1.7.2/jquery.min.js"  
  20.     type="text/javascript"></script>  
  21. <script src="/static/jquery-easyui/1.2.6/jquery.easyui.min.js"  
  22.     type="text/javascript"></script>  
  23. <script  
  24.     src="/static/jquery-validation/1.9.0/jquery.validate.min.js"  
  25.     type="text/javascript"></script>  
  26. <script src="/static/jquery-validation/1.9.0/messages_cn.js"  
  27.     type="text/javascript"></script>  
  28.    
  29. <script>    
  30.   
  31. $(document).ready(function() {  
  32.     $("#inputForm").validate({  
  33.         rules : {  
  34.                 name:{  
  35.                     required:true,  
  36.                     minlength:"3"     
  37.                 },    
  38.                 password:{  
  39.                     minlength:"3"     
  40.                 },    
  41.                 passwordConfirm:{  
  42.                     equalTo : "#password"  
  43.                 },  
  44.                 email:{  
  45.                     required:true,  
  46.                     email:true    
  47.                 }         
  48.         },  
  49.         messages : {  
  50.   
  51.         }  
  52.     });  
  53. });  
  54. </script>  
  55. <title>PLMII:用户管理</title>  
  56. </head>  
  57. <body>  
  58.     <form id="inputForm" action="user!save.action" method="post">   
  59.     <table align="left">  
  60.         <tr align="left">  
  61.         <td nowrap><label for="name" class="field">姓名:</label></td>  
  62.         <td><input  type="text" id="name" name="name" size="25" value=""/></td>     
  63.         <td nowrap><label for="email" class="field">邮箱:</label></td>  
  64.         <td><input  type="text" id="email" name="email"    size="25" value=""/></td>    
  65.         </tr>  
  66.             <tr align="left">                   
  67.         <td nowrap><label for="password" class="field">密码:</label></td>  
  68.         <td><input type="password" id="password" name="password" size="26" value="" /></td>  
  69.         <td nowrap><label for="passwordConfirm" class="field">确认密码:</label></td>  
  70.         <td><input type="password" id="passwordConfirm" size="26" value="" /></td>                      
  71.        </tr>  
  72.            <tr>  
  73.                <td colspan=4 align="center">  
  74.                    <a href="#"class="easyui-linkbutton" iconCls="icon-ok"onclick='$("#inputForm").submit()'>提交</a>   
  75.                    <a href="#" class="easyui-linkbutton" iconCls="icon-cancel"onclick="history.back(-1)">取消</a>  
  76.                </td>  
  77.            </tr>  
  78.        </table>  
  79.     </form>  
  80. </body>  
  81. </html>  

 
在这段代码中，不会验证两个密码是否相同，因为确认密码输入框只定义了其id，而未定义其name，将其name加上，则验证正常。 

 

 

 
 
 
  
 
   [html]  
   view plain 
    copy 
   
 
   
 
    
  
 
 
 
 
  1.  <tr align="left">                   
  2.      <td nowrap><label for="password" class="field">password:</label></td>  
  3.      <td><input type="password" id="password" name="password" size="26" value="" /></td>  
  4.      <td nowrap><label for="passwordConfirm" class="field">确认password:</label></td>  
  5.      <td><input type="password" id="passwordConfirm" name="passwordConfirm" size="26" value="" /></td>                   
  6.  </tr>  
 


                

        

        

    




    

      

        

            

              
                
                  Ron_Miu
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                      0
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    0
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      










                



	

		

			

				
					
jquery.validate.js

				
			

			

				

					08-25
				

			

		

		

			
				
jquery,validate

			
		

	



                

              
                



	

		

			

				
					
element form的内嵌属性validate，form表单提交时判断规则

				
			

			

				

					weixin_42206375的博客
				

				

					04-21
					
					2342
					
				

			

		

		

			
				
//element form ,通过this.$refs.form.validate打印出来的element源码
validate: function validate(callback) { 
			var _this2 = this;   if (!this.model) {        			
				console.warn('[Element Warn][Form]model is required for validate to work!');        
				return;   .

			
		

	



                


  
              

                


	

		

			

				
					
jQuery Validate 表单验证插件----通过name属性来关联字段来验证，改变默认的提示信息，将校验规则写到 js 代码中...

				
			

			

				

					weixin_34247032的博客
				

				

					01-16
					
					170
					
				

			

		

		

			
				
一、下载依赖包
 
网盘下载：https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224
 
二、 添加一个另外一个插件jquery.validate.messages_cn.js。
改变默认提示方式。
 

/*
 * Translated default messages for the jQuery validation plugin.
 * L...

			
		

	





	

		

			

				
					
JQuery formValidator表单验证插件属性介绍

				
			

			

				

					fyrlovezzp的专栏
				

				

					12-26
					
					1200
					
				

			

		

		

			
				
JQuery formValidator使用方法：

1.加载jQuery类库

2.加载插件的样式库，如果你是自动构建提示层，请加载validatorAuto.css

3.加载插件 

4.加载扩展库




JQuery formValidator目前支持5种大的校验方式，分别是：
inputValidator（针对input、textarea、select控件的

			
		

	



		

			
		



	

		

			

				
					
JQuery表单验证插件----validation

				
			

			

				

					sunvsjay1890的专栏
				

				

					10-11
					
					1390
					
				

			

		

		

			
				
Mini-Web 帐号管理
	
	
	
	
	
	
	
	
		$(document).ready(function() {
			//聚焦第一个输入框
			$("#loginName").focus();
			//为inputForm注册validate函数
			$("#inputForm").validate({
				rules: {
					logi

			
		

	





	

		

			

				
					
jquery.validate表单验证插件使用详解

				
			

			

				

					10-19
				

			

		

		

			
				
在本文中，我们将深入探讨jQuery Validate插件的使用方法，这是一个强大的JavaScript库，用于实现高效且用户友好的表单验证。jQuery Validate插件简化了在HTML表单中添加验证规则的过程，无需编写复杂的正则表达式，...

			
		

	





	

		

			

				
					
基于Bootstrap+jQuery.validate实现Form表单验证

				
			

			

				

					12-09
				

			

		

		

			
				
基于Bootstrap jQuery.validate Form表单验证实践项目结构 ：  github 上源码地址：https://github.com/starzou/front-end-example 1、form 表单代码[html]  代码如下: <!DOCTYPE html>  <html>   <...

			
		

	





	

		

			

				
					
jquery.validate.js表单验证[借鉴].pdf

				
			

			

				

					10-19
				

			

		

		

			
				
下面是一个简单的使用示例，展示了如何在表单上应用 `jQuery.validate.js` 进行验证：  ```html <form id="myForm">  <input type="text" name="email" required>  提交"> </form>   $(document).ready(function() {...

			
		

	





	

		

			

				
					
jquery.validate.js 多个相同name的处理方式

				
			

			

				

					10-19
				

			

		

		

			
				
在使用jQuery Validate插件进行表单验证时，可能会遇到一个问题：当表单中有多个具有相同`name`属性的输入元素时，插件默认只会对第一个元素进行验证。这是因为jQuery Validate插件的机制是针对每个`name`属性唯一的...

			
		

	





	

		

			

				
					
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法

				
			

			

				

					10-20
				

			

		

		

			
				
主要介绍了jQuery Validate验证表单时多个name相同的元素只验证第一个的问题及解决方法,需要的朋友可以参考下

			
		

	





	

		

			

				
					
jquery validate 支持验证name重复的表单

				
			

			

				

					01-09
				

			

		

		

			
				
在项目中经常遇到，表单可以动态追加多行。但是追加的行中，input 文本框的name会重复。如果用jquery validator ，它只支持验证第一个input,后面的name相同的input不会被验证，怎么办呐？经过研究源码，提出了解决办法。
基于jQuery Validation Plugin - v1.14.0 - 6/30/2015改造

			
		

	





	

		

			

				
					
jquery validate插件

				
			

			

				

					it_lihongmin的博客
				

				

					07-22
					
					409
					
				

			

		

		

			
				
之前经常用jquery的validate插件，觉得非常好用只是每次有用到的时候就会去copy原来的项目中找，并且有些比较不常用的用法就会找很长的时间，所以觉得将其总结一下，方便别人查找也方便自己快速查找使用。

1、初始化用法：




$("#inputForm").validate({
				rules : {
					url : {
						required :false,
			...

			
		

	





	

		

			

				
					
Jquery validate 验证

				
			

			

				

					metecyu的专栏
				

				

					09-04
					
					856
					
				

			

		

		

			
				
1 必填和远程校验
$("#inputForm").validate({
	rules: {
		"username": "required",
		"loginid": {
			remote: {
				type: "post",
				url: "${ctx}/user/isUniCode.do",
				data: {
					code: function() {
						r

			
		

	





	

		

			

				
					
jQuery.form和jQuery.validate的使用

				
			

			

				

					williamHappy的博客
				

				

					01-05
					
					1882
					
				

			

		

		

			
				
jquery.form的两种提交方式方式1：ajaxFormajaxForm方式必须先绑定表单，它一般在$(document).ready(function(){})中定义，他能让表单在不刷新页面的情况下post到目标，例：$(document).ready(function(){
   $('#updateForm').ajaxForm(function(){
        alert("aja

			
		

	





	

		

			

				
					
JQuery表单验证(validate):常用例子介绍

				
			

			

				

					白衣
				

				

					12-06
					
					3924
					
				

			

		

		

			
				
JQuery表单验证jquery.validate.js是jquery旗下的一个验证插件，借助jquery的优势，我们可以迅速验证一些常见的输入,并且可以自己扩充自己的验证方法。举个例子，有这么一个表单：    <form id="signupForm" method="get" action="">
        <fieldset>
            <legend>Validating

			
		

	





	

		

			

				
					
JQuery Validate自带验证例子

				
			

			

				

					DevGu
				

				

					05-19
					
					578
					
				

			

		

		

			
				
$("#inputForm").validate({
    rules: {    
        strategyTypeId: {                       
            remote:{ 
                url: "${ctx}/asset/checkAssetName?nocache=" + new Date().getTime(),

			
		

	





	

		

			

				
					
【推荐】Form（表单）利用Jquery Validate验证以及ajax提交

				
			

			

				

					jianai0602的博客
				

				

					05-07
					
					2206
					
				

			

		

		

			
				
概述详细讲解Form表单利用Jquery   Validate验证以及ajax提交的过程，以及Validate的自定义提示语，非空判断，input字段的远程ajax验证等。环境准备在html中引入四个js文件（jquery文件，jquery.form文件，jquery.validate文件，jquery.validate.extend文件）：&lt;script src="/jquery/jque...

			
		

	





	

		

			

				
					
Form表单利用Jquery Validate验证以及ajax提交

				
			

			

				

					Java 技术专栏，从入门到精通，熟悉企业级开发
				

				

					08-22
					
					4万+
					
				

			

		

		

			
				
详细讲解Form表单利用Jquery Validate验证以及ajax提交的过程，以及Jquery Validate使用中的input写法，Validate的标尺，Validate的自定义提示语，非空判断，input字段的远程ajax验证等。

			
		

	





	

		

			

				
					
validate表单验证

					
热门推荐

				
			

			

				

					chenjing928的博客
				

				

					10-04
					
					7万+
					
				

			

		

		

			
				
使用validate做表单验证，实现效果如图：




当然，也可以换成中文的（如果你觉得默认的提示信息不是你想要的，你也可以自定义提示信息）


validate使用步骤:
1.导入jquery.js
2.导入validate.js
3.在页面加载成功之后 对表单进行校验  $("选择器").validate()
4.在validate中编写校验规则
$("选择器").

			
		

	





	

		

			

				
					
bootstrap html5 表单验证,基于Bootstrap+jQuery.validate实现表单验证

					
最新发布

				
			

			

				

					05-29
				

			

		

		

			
				
5. 在提交表单之前，可以使用jQuery.validate插件来验证表单。例如：  ```javascript $('form.needs-validation').submit(function(event) {  if ($(this).valid() === false) {  event.preventDefault();  event....

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值