Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hạn chế » Kiểm tra vùng nhập liệu
URL: https://www.javascriptbank.com/form-set-validation.html
Hiệu ứng sẽ kiểm tra xem bạn có nhập đúng và đầy đủ các vùng đã được yêu cầu hay không và sẽ hiển thị thông báo.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hạn chế » Kiểm tra vùng nhập liệu
URL: https://www.javascriptbank.com/form-set-validation.html
<style type="text/css"> .fld { width:285px; text-align:center; } div#errors { color:red; font-weight:bold; } </style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<script type="text/javascript">// author: Kelly Johnson// [email protected]//Name: From Set Validator var required = new Array(); var form_nm = "myForm"; window.onload = function() { var elems = document.forms[form_nm].elements; for(var i=0,a;a=elems[i];i++) { if(a.getAttribute('set') == "required") { required[required.length] = i; a.onkeyup = function() { return isOk(this.form); } } } return isOk(document.forms[form_nm]); } function isOk(frm) { var error = new Array(); for(var i=0,a;i<required.length;i++) { a=required[i]; if(!eval(frm.elements[a].getAttribute('regexp')).test(frm.elements[a].value)) { error[error.length] = "Field "+ frm.elements[a].getAttribute('id') +" are not correctly filled in."; } } frm.elements[frm.elements.length-1].disabled = error.length; document.getElementById('errors').innerHTML = "Good to Go!"; if(error.length) { document.getElementById('errors').innerHTML = error.join('<BR>'); } } </script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<form name="myForm" action="someScript.pl" method="post"> <fieldset class="fld"><legend>Fields: </legend><!-- Validates with at least 1 digit, only digits -->Numbers: <input type="text" id="numbers" set="required" name="txt1" regexp="/^\d+$/" size="20"><br><!-- Optional -->Text2: <input type="text" id="txt2" set="optional" name="txt2" size="20"><br><!-- Optional -->Text3: <input type="text" id="txt3" set="optional" name="txt3" size="20"><br><!-- Validates with 5 letters, or more, no non-letters -->Letters: <input type="text" id="letters" set="required" name="txt4" regexp="/^[A-Za-z]{5,}$/" size="20"><br><button type="submit" name="sbmt" id="sbmt" disabled="disabled">Submit!</button></fieldset> </form> <fieldset class="fld" style="height: 100px;"><legend>Errors</legend><div id="errors">Field numbers are not correctly filled in.<br>Field letters are not correctly filled in.</div></fieldset><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->