»
Tiếng AnhTiếng PhápTiếng Việt

In - Kiểm tra vùng nhập liệu - JavaScriptBank.com

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

Kiểm tra vùng nhập liệu © JavaScriptBank.comHiệ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



CSS
<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-->


JavaScript
<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-->


HTML
  <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-->