便捷表单提交验证方式

最新推荐文章于 2025-11-05 18:30:00 发布

原创最新推荐文章于 2025-11-05 18:30:00 发布 · 98 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript #HTML #ViewUI

本文介绍了一个简单的HTML表单，其中包含了两个输入字段，并使用JavaScript进行验证。当用户离开输入框时，将检查输入是否为'1'，所有验证通过后才能提交表单。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

</HEAD>

<BODY>
<form id="myform" action="http://hao123.com" method="get">
元素1：<input type="text" name="name1" id="el1" onblur="return check('el1')"><br>
元素2：<input type="text" name="name2" id="el2" onblur="return check('el2')"><br>
<input type="button" name="doDelBu" value="提交" onclick="sub('myform')"/>
</form>
</BODY>
   <script type="text/javascript">
function check(elId){
var el = document.getElementById(elId);
if(el.value == '1'){
  return true;
}else{
  alert("1");
  return false;
}
}
function sub(formId){
var myform = document.forms(formId);
var elements = myform.getElementsByTagName('input');
var il = elements.length;
var subFlag = true;
for(var i=0;i<il;i++){
  if(elements[i].getAttribute('type') == 'text'){
   var temp = elements[i].onblur();
   subFlag = (subFlag && temp);
  }
}
if(subFlag){
  myform.submit();
}
}
</script>
</HTML>

http://huodong.duomi.com/music_303029713_Listen.html

submitFrom = function(fromId){
var form = document.getElementById(fromId);
var elements = form.elements;
var il = elements.length;
var subFlag = true;
for(var i=0;i<il;i++){
  var elType = elements[i].getAttribute('type');
  //alert(elType);
  if(elType=='text' || elType=='select-one' || elType=='select' || elType=='textarea'){
   if(elements[i].onblur != '' && elements[i].onblur != null){
    //alert('onblur event --' + elements[i].name);
    var temp = elements[i].onblur();
    //alert(elements[i].name + '--' + temp);
    subFlag = (subFlag && temp);
   }
  }
}
if(subFlag){
  //alert("begin submit");
}
}