<style>
span{
color:blue;
}
input{
padding-bottom:4px;
}
</style>
<fieldset style="width:600px;border:2px solid blue;font-weight:bold;">
<legend>请输入订单信息</legend>
订单编号:<input id="no" type="text"/><span>请输入第一位非零的六位订单号</span><br/>
客户姓名:<input id="name" type="text"/><span>请输入不超过12个汉字的姓名</span><br/>
身份证号:<input id="number" type="text"/><span>请输入5-18位的纯数字身份证号</span><br/>
送货地址:<input id="address" type="text"/><span>送货地址必须填写</span><br/>
联系电话:<input id="phone" type="text"/><span>请输入1开头的13位电话号码</span><br/>
电子邮件:<input id="email" type="text"/><span>请输入你的电子邮箱</span><br/>
.................................................................................................................
</fieldset>
<script>
function $(name){
return document.getElementById(name);
}
function hide(ele){
ele.style.display="none";
}
function show(ele){
ele.style.display="";
}
var reg = /^[1-9]\d{5}$/;
$("no").onkeyup=function(){
var sib = $("no").nextSibling;
if(reg.test($("no").value)){
hide(sib);
}else{
show(sib);
}
}
var reg2=/^[\u4E00-\u9FA5]{0,12}$/;
$("name").onkeyup=function(){
var sib = $("name").nextSibling;
if(reg2.test($("name").value)){
hide(sib);
}else{
show(sib);
}
}
var reg3=/^\d{5,18}$/;
$("number").onkeyup=function(){
var sib = $("number").nextSibling;
if(reg3.test($("number").value)){
hide(sib);
}else{
show(sib);
}
}
$("address").onkeyup=function(){
var sib = $("address").nextSibling;
if($("address").value.trim()!==""){
hide(sib);
}else{
show(sib);
}
}
var reg4=/^1\d{12}$/;
$("phone").onkeyup=function(){
var sib = $("phone").nextSibling;
if(reg4.test($("phone").value)){
hide(sib);
}else{
show(sib);
}
}
var reg5=/^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/;
$("email").onkeyup=function(){
var sib = $("email").nextSibling;
if(reg5.test($("email").value)){
hide(sib);
}else{
show(sib);
}
}
</script>
