输入验证与错误处理技巧-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_8052/article/details/82172864

01.不能为空

02.<input οnblur="if(this.value.replace(/^ +| +$/g,'')=='')alert('不能为空!')">

03.

04.只能输入英文和数字

05.<input οnblur="if(/[^0-9a-zA-Z]/g.test(value))alert('有错')">

06.<input οnkeyup="value=value.replace(/[^0-9a-zA-Z]/g,'')"/>

07.<input type="text" οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9]/g,'')">

08.

09.判断字符由字母和数字，下划线,点号组成.且开头的只能是下划线和字母

10./^([a-zA-z_]{1})([\w]*)$/g.test(str)

11.

12.只能输入数字

13.<input name="text" type="text" id="NewPage" onKeyUp="value=value.replace(/\D/g,'')" onafterpaste="value=value.replace(/\D/g,'')" >

14.

15.只能输入中文

16.<input type="text" οnkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')">

17.

18.只能输入英文

19.<input type="text" οnkeyup="value=value.replace(/[^\a-\z\A-\Z]/g,'')">

20.<input type="text" οnkeyup="value=value.replace(/[^a-zA-Z]/g,'')">

21.

22.只能输入中文、英文、数字、@符号和.符号

23.<input type="text" οnkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\@\.]/g,'')">

24.

25.只允许输入英文，且不能粘贴也无法弹出粘贴菜单

26.<input type="text" οnkeyup="value=value.replace(/[^\a-\z\A-\Z]/g,'')" οnkeydοwn="fncKeyStop(event)" οnpaste="return false" oncontextmenu = "return false"/>

27.

28.只能输入数字和点号(注意:在[^\d\.]里的d不能写成大写D,否则就变成除了数字以外的所有字符)

29.<input name="price" type="text" size="8" maxlength="8" οnkeyup="value=value.replace(/[^\d\.]/g,'')" >

30.

31.总而言之:先在<input>里输入οnkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的X换成你想输入的代码就可以了

32.

33.中文：u4E00-u9FA5

34.数字：d、0-9

35.英文：a-z、A-Z

36.其它符号@,点或其它符号.也可以多个,用\隔开就行了.

37.例如:

38.中、英文和数字加@符号加点符号：\a-\z\A-\Z0-9\u4E00-\u9FA5\@\.

39.

40.若想在文本框里不能右键弹出菜单和不能粘贴进复制的信息的话就要在<input>里输入 onKeyDown="fncKeyStop(event)" οnpaste="return false" οncοntextmenu="return false;"
复制代码

---------------------
清空表单的js
1. function reset(){
var form = document.getElementById("currform");
form.reset();
}
2.document.getElementById("orgName").value="";

3.删除
function[color=red] delete1(){[/color]
var form = document.getElementById("currform");
form.action="org_delete";
form.submit();
}
此处要是用delete则不行。为定义有其他含义代码。

4.checkbox传值--注意没有Int
function delete1(){
var form = document.getElementById("currform");
var checks = document.[color=red]getElementsByName[/color]("orgOid");

[color=red] for(i=0;i<checks.length;i++){[/color] if(checks[i].checked){
var element = checks[i].value;
form.action="org_delete?orgOid="+element;
form.submit();
}
}
}

5.出现confirm框
<html>
<head>
<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button!");
if (r==true)
{
alert("You pressed OK!");
}
else
{
alert("You pressed Cancel!");
}
}
</script>
</head>
<body>

<input type="button" οnclick="show_confirm()" value="Show a confirm box" />

</body>
</html>

6.throw的一个验证
var x=prompt("请输入 0 至 10 之间的数：","")
try
{
if(x>10)
throw "Err1"
else if(x<0)
throw "Err2"
else if(isNaN(x))
throw "Err3"
}
catch(er)
{
if(er=="Err1")
alert("错误！该值太大！")
if(er == "Err2")
alert("错误！该值太小！")
if(er == "Err3")
alert("错误！该值不是数字！")
}

7.捕捉页面上的错误
<html>
<head>
<script type="text/javascript">
οnerrοr=handleErr
var txt=""

function handleErr(msg,url,l)
{
txt="本页中存在错误。\n\n"
txt+="错误：" + msg + "\n"
txt+="URL: " + url + "\n"
txt+="行：" + l + "\n\n"
txt+="点击“确定”继续。\n\n"
alert(txt)
return true
}

function message()
{
adddlert("Welcome guest!")
}
</script>
</head>

<body>
<input type="button" value="查看消息" οnclick="message()" />
</body>

</html>

8.页面上面显示时钟
<html>
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',1500)
}

function checkTime(i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
</head>

<body οnlοad="startTime()">
<div id="txt"></div>
</body>
</html>

9.表单中邮箱的验证
<html>
<head>
<script type="text/javascript">
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Not a valid e-mail address!")==false)
{email.focus();return false}
}
}
</script>
</head>

<body>
<form action="submitpage.htm"οnsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>

</html>

10.对元素和id的取法
$("button").click(function(){
$("#test").hide();

11.ajax
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/ajax/demo_get.asp",true);
xmlhttp.send();
}
</script>
</head>
<body>

<h2>AJAX</h2>
<button type="button" οnclick="loadXMLDoc()">请求数据</button>
<div id="myDiv"></div>

</body>
</html>

12.两种方式取节点值的长度
/*
$(document).ready(function(){
$("#loginButton").click(function(){
alert("asd");
alert($("#loginId").val().length)
});
});
*/

function validate_form(myform){
var id = document.getElementById("loginId");
var password = document.getElementById("pwd");
if(id.value.length==0){
alert("id不能为空");
id.focus();
return false;
}
if(password.value.length==0){
alert("password不能为空");
password.focus();
return false;
}
}

js代码小结