Heim >Web-Frontend >js-Tutorial >jquery.validate fordert den Speicherort der Fehlermeldung method_jquery auf
Das Beispiel in diesem Artikel beschreibt die jquery.validate-Methode zur Lokalisierung von Eingabeaufforderungsfehlermeldungen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Ich habe das Plug-in jquery.validate.js schon lange nicht mehr verwendet und es fast vergessen. Leider sollten gute Dinge immer herausgenommen und überprüft werden. Heute bin ich auf ein kleines Problem gestoßen, nämlich die Position der Fehlermeldung. Ich bin schon einmal darauf gestoßen, aber ich habe es jetzt vergessen. Wenn ich es in Zukunft vergesse, werde ich zurückblicken. Wie das Sprichwort sagt: Ein gutes Gedächtnis ist schlechter als eine schlechte Schrift.
Zum Beispiel wird jeder wissen, was los ist.
rules: { name:{ required:true, rangelength:[1,20] }, validateCode: { required:true, number:true, rangelength:[5,5] } }, messages: { name: { required: "请输入命令名", rangelength: jQuery.format("长度请控制在{0} ~ {1}") }, validateCode: { required: "请输入验证码", number: "请输入数字", rangelength: jQuery.format("长度必须是5位") } }, success: function(label) { label.addClass("error checked"); }, submitHandler: function(form) { if($("#RegionId").val() == '0'){ $("#citySelect").attr("class","error").html('请选择区域').show(); $("#RegionId").attr("class","error"); }else{ $("#RegionId").attr("class","valid"); $("#citySelect").attr("class","valid").html('success').show(); form.submit(); } } });
Im obigen Code habe ich keine Methode zum Speichern der Fehlermeldung hinzugefügt. Schauen wir uns den Effekt an
<td> <input type="text" maxlength="30" value="" id="name" name="name"> <label for="name" generated="true">请输入命令名</label> //错误信息会自动根在输入框的后面。 </td>
Wenn wir die Methode „errorPlacement“ zur Lokalisierung von Fehlermeldungen hinzufügen, sehen wir uns an, wie der Effekt aussieht.
rules: { name:{ required:true, rangelength:[1,20] }, validateCode: { required:true, number:true, rangelength:[5,5] } }, messages: { name: { required: "请输入命令名", rangelength: jQuery.format("长度请控制在{0} ~ {1}") }, validateCode: { required: "请输入验证码", number: "请输入数字", rangelength: jQuery.format("长度必须是5位") } }, errorPlacement: function(error, element) { //错误信息位置设置方法 error.appendTo( element.parent().next() ); //这里的element是录入数据的对象 }, success: function(label) { label.addClass("error checked"); }, submitHandler: function(form) { if($("#RegionId").val() == '0'){ $("#citySelect").attr("class","error").html('请选择区域').show(); $("#RegionId").attr("class","error"); }else{ $("#RegionId").attr("class","valid"); $("#citySelect").attr("class","valid").html('success').show(); form.submit(); } } });
Sehen wir uns die Wirkung an
<tr> <th><label for="name" id="lname"><code title="必填">*</code>命令名称</label></th> <td><input type="text" maxlength="30" value="" id="name" name="name"></td> <td><label for="name" generated="true">请输入命令名</label></td> //错误信息跑到这儿来了, </tr>
Es ist ganz einfach. Selbst einfache Dinge werden vergessen, wenn Sie sie längere Zeit nicht verwenden.
Leser, die an weiteren Inhalten zu jQuery-Plug-ins interessiert sind, können sich das Spezialthema dieser Website ansehen: „ Zusammenfassung gängiger jQuery-Plug-ins und deren Verwendung“
Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.