jquery validate 二選一，錯誤提示在一處

時間 2019-11-11

原文原文鏈接

轉載自：http://blog.51yip.com/jsjquery/1483.htmlhtml

有一同事對jquery validate這個插件不熟，實現多處報錯信息在一處，而且還有二選一的狀況，二個輸入框，有一個輸入就算經過。groups能夠把多處報錯放到一處，depends能夠解決多選一的狀況。下面舉個例子，demojquery

如下是部分代碼，所有代碼看上面的例子。post

 
   查看複製打印? 
  
     $("#myform").validate({  
       groups: {  
         username: "fname lname"   //username定義的組名，fname lname是輸入框的名子，能夠看上面的demo  
       },  
       errorPlacement: function(error, element) {  //錯誤提示在什麼地方  
          if (element.attr("name") == "fname" || element.attr("name") == "lname" ){  
            error.insertAfter("#lastname");    //若是是fname和lname呢，就#lastname後面  
          }else{  
            error.insertAfter(element);  
          }  
        },  
        rules:{  
             fname:{  
                 required: {  
                     depends:function(){ //二選一  
                         return ($('input[name=lname]').val().length <= 0);  
                     }  
                 }  
             },  
             lname:{  
                 required: {  
                     depends:function(){ //二選一  
                         return ($('input[name=fname]').val().length <= 0);  
                     }  
                 }  
             }  
         },  
         messages:{ //提示報錯  
             fname:"first name or last name at least one",  
             lname:"first name or last name at least one"  
         },  
        debug:true  
      });  
   
 ==================上面是js==============================  
   
 <body style="margin-left:500px;margin-top:100px;">  
 <div style="font-size:22px;">test</div><br>  
   <form id="myform" method="post">  
   <label>Your Name</label>  
   <input name="fname" value="" />  
   <input name="lname" id="lastname" />  
   <br/>  
   <input type="submit" value="Submit"/>  
 </form>  
 </body>  

若是對插件jquery validate這個插件很熟的話，能夠看一下jquery.validate.js，方法裏面都有。ui

轉載請註明
做者:海底蒼鷹
地址:http://blog.51yip.com/jsjquery/1483.html
spa

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。