html和js怎么非空验证

html-css021

html和js怎么非空验证,第1张

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

使用说明:

1、消息显示对象id = 输入表单id + _msg

如用户名输入表单id=txt_username,消息显示对象id=txt_username_msg

2、错误消息:写在输入表单的title里,具体如下

<script>

//参数说明 ,o : 检查对象 ,sType : 数据类型

function CheckInput(o ,sType){

var msg=document.getElementById(o.id + '_msg')

//用户名

if(sType=='username'){

msg.innerHTML=(!/^[a-z0-9]{4,20}$/gi.test(o.value))? o.title : '√'

}

//密码

if(sType=='password'){

msg.innerHTML=(!/^[\S]{6,20}$/gi.test(o.value))? o.title : '√'

}

//更多数据类型验证方法可以自己添加....

}

</script>

</head>

  <body>

 用户名:<input type="text" name="txt_username" id="txt_username" onblur="CheckInput(this, 'username')" title="用户名不能为空

,应为4-20个字母数字组成!"/><span id="txt_username_msg"></span>

<br/>

密码:<input type="text" name="txt_password" id="txt_password" onblur="CheckInput(this, 'password')" title="密码不能为空,应

为6-20个非空字符组成!"/><span id="txt_password_msg"></span>

</body>

</html>

简单改了下你的,效果实现了,规范的写法自己改改吧

<!DOCTYPE html>  

<html>  

<head>  

    <meta charset="UTF-8"/>  

    <title>checkValidity 示例</title> 

    <style>

      input.dd::-webkit-input-placeholder{

          color: red

          opacity:1

      } 

       

    </style>

</head>  

<body> 

<form action="" method="get">

<table width="200%" border="0" cellspacing="0" cellpadding="0" >

  <tr>

    <td><input class='' id='id' name="uname" type="text" placeholder="ID" onblur="aa(this)"></td>

  </tr>

  <tr>

    <td><input name="pwd" type="password" placeholder="密码"></td>

  </tr>

  <tr>

    <td><input name="" type="submit"></td>

  </tr>

</table>

</form>

<script> 

  function aa(a){

      if(a.value==''){

        a.placeholder='ID不能为空'

       a.className="dd"

      }

  }

</script>

</body>  

</html>