js总结

Js常用函数总结

js提交表单及js表单验证

2008-05-09 22:37

js提交表单及js表单验证功能强大,很多原本需要在服务器端实现的功能,现在通过简单的js代码就可以在客服端实现同样的效果。下面是一些常用的js表单验证代码,供大家参考学习。

1:js 字符串长度限制、判断字符长度 、js限制输入、限制不能输入、textarea 长度限制

<script>

function test()

{

if(document.a.b.value.length>50)

{

alert("不能超过50个字符!");

document.a.b.focus();

return false;

}

}

</script>

2:js验证邮箱格式

<SCRIPT LANGUAGE=javascript RUNAT=Server>

function isEmail(strEmail) {

if

(strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)

return true;

else

alert("oh");

}

</SCRIPT>

3: js屏蔽关键字(这里屏蔽***和****)

<script language="javascript1.2">

function test() {

if((a.b.value.indexOf ("***") == 0)||(a.b.value.indexOf ("****") == 0)){ alert(":)");

a.b.focus();

return false;}

}

</script>

4: js两次输入密码是否相同

<script>

function check()

{

with(document.all){

if(input1.value!=input2.value)

{

alert("false")

input1.value = "";

input2.value = "";

}

else document.forms[0].submit();

}

}

</script>

5:js屏蔽右键

oncontextmenu="return false" ondragstart="return false"

onselectstart="return false"加在body中

6: js判断表单项不能为空

<script language="javascript"><!--

function CheckForm()

{

if (document.form.name.value.length == 0) {

alert("请输入您姓名!");

document.form.name.focus();

return false;

}

return true;

}

-->

</script>

7:js比较两个表单项的值是否相同

<script language="javascript">

<!--

function CheckForm()

if (document.form.PWD.value != document.form.PWD_Again.value) {

alert("您两次输入的密码不一样!请重新输入.");

document.ADDUser.PWD.focus();

return false;

}

return true;

}

-->

</script>

8:js判断表单项只能为数字和"_",用于电话/银行帐号验证上,可扩展到域名注册等

<script language="javascript">

<!--

function isNumber(String)

{

var Letters = "1234567890-"; //可以自己增加可输入值 var i;

var c;

if(String.charAt( 0 )=='-')

return false;

if( String.charAt( String.length - 1 ) == '-' ) return false;

for( i = 0; i < String.length; i ++ )

{

c = String.charAt( i );

if (Letters.indexOf( c ) < 0)

return false;

}

return true;

}

function CheckForm()

{

if(! isNumber(document.form.TEL.value)) {

alert("您的电话号码不合法!");

document.form.TEL.focus();

return false;

}

return true;

}

-->

</script>

9:js判断表单项输入数值/长度限定

<script language="javascript"><!--

function CheckForm()

{

if (document.form.count.value > 100 || document.form.count.

value < 1)

{

alert("输入数值不能小于零大于100!");

document.form.count.focus();

return false;

}

if (document.form.MESSAGE.value.length<10) {

alert("输入文字小于10!");

document.form.MESSAGE.focus();

return false;

}

return true;

}

//-->

</script>

10:js判断中文/英文/数字/邮件地址合法性判断 <SCRIPT LANGUAGE="javascript"><!--

function isEnglish(name) //英文值检测 {

if(name.length == 0)

return false;

for(i = 0; i < name.length; i++) { if(name.charCodeAt(i) > 128)

return false;

}

return true;

}

function isChinese(name) //中文值检测 {

if(name.length == 0)

return false;

for(i = 0; i < name.length; i++) { if(name.charCodeAt(i) > 128)

return true;

}

return false;

}

function isMail(name) // E-mail值检测 {

if(! isEnglish(name))

return false;

i = name.indexOf(" at ");

j = name dot lastIndexOf(" at ");

if(i == -1)

return false;

if(i != j)

return false;

if(i == name dot length)

return false;

return true;

}

function isNumber(name) //数值检测

{

if(name.length == 0)

return false;

for(i = 0; i < name.length; i++) {

if(name.charAt(i) < "0" || name.charAt(i) > "9") return false;

}

return true;

}

function CheckForm()

{

if(! isMail(form.Email.value)) {

alert("您的电子邮件不合法!");

form.Email.focus();

return false;

}

if(! isEnglish(form.name.value)) {

alert("英文名不合法!");

form.name.focus();

return false;

}

if(! isChinese(form.cnname.value)) {

alert("中文名不合法!");

form.cnname.focus();

return false;

}

if(! isNumber(form.PublicZipCode.value)) {

alert("邮政编码不合法!");

form.PublicZipCode.focus();

return false;

}

return true;

}

//-->

</SCRIPT>

11:js限定表单项不能输入的字符

<script language="javascript"><!--

function contain(str,charset)// 字符串包含测试函数

{

var i;

for(i=0;i<charset.length;i++)

if(str.indexOf(charset.charAt(i))>=0)

return true;

return false;

}

function CheckForm()

{

if ((contain(document.form.NAME.value, "%\(\)><")) || (contain(document.form.MESSAGE.value, "%\(\)><")))

{

alert("输入了非法字符");

document.form.NAME.focus();

return false;

}

return true;

}

//-->

</script>

12:js检查一段字符串是否全由数字组成

<script language="Javascript"><!--

function checkNum(str){return str.match(/\D/)==null} alert(checkNum("1232142141"))

alert(checkNum("123214214a1"))

// --></script>

13:js怎么判断是否是字符

<script language="Javascript"><!--

function checkChr(str)

if (/[^\x00-\xff]/g.test(s)) alert("含有汉字"); else alert("全是字符");

// --></script>

14: 邮箱格式验证

<script language="Javascript"><!--

//函数名:chkemail

//功能介绍:检查是否为Email Address

//参数说明:要检查的字符串

//返回值:0:不是 1:是

function chkemail(a)

{ var i=a.length;

var temp = a.indexOf('@');

var tempd = a.indexOf('.');

if (temp > 1) {

if ((i-temp) > 3){

if ((i-tempd)>0){

return 1;

}

}

}

return 0;

}

// --></script>

 

第二篇:js事件总结

JS事件

用事件来提示用户是否删除:

<a href="test1.html" onclick="return doDelete(event);">删除记录</a> function doDelete() {

if(confirm("确定删除吗?")) {

return true;

}

return false;

}

限制用户用键盘输入大写字母:

<input type="text" id="input1" onkeypress="return test(event)"/> function test(evt){

var ch;

var reg = /^[A-Z]$/;

if(window.ActiveXObject){

ch = window.event.keyCode;

}else{

ch = evt.charCode;

}

ch = String.fromCharCode(ch);

alert(ch);

if(reg.test(ch)){

return false;

}

return true;

}

HTML事件句柄

js事件总结

支持通过事件处理句柄函数返回false而取消默认动作的句柄:

Onkeydown / onkeypress / onmousedown / onmouseup / onclick /onsubmit /onreset

隐藏div:

方法一:利用css隐藏

Document.getElementById(“mydiv”).style.display = “none”;

方法二:移除该节点

Document.body.removeChild(document.getElementById(“mydiv”));

Document.attachEvent(“onclick”,functionName1);

Document.attachEvent(“onclick”,functionName2);

判断浏览器:

<script language="javascript"> if(window.ActiveXObject){ alert("IE"); }else{ alert("FireFox"); } </script> Var nav = navigator.userAgent;//得到浏览器名 Var nav = navigator.userAgent.toLowerCase(); if(nav.indexOf(“ie”)>-1){ Document.attachEvent(“onclick”,functionName1); Document.attachEvent(“onclick”,functionName2); } Else { Document.addEventListenter(“click”,eventTest1,false);//在fireFox中,事件直接是事件名,不需加on。 Document.addEventListenter(“click”,eventTest2,false); }

js事件总结

在事件传播的过程中,通过事件对象设置cancelBubble为true(IE浏览器)可停止事件的冒泡,或调用事件对象的stopPropagation()方法停止事件的传播(FF) <script language="javascript"> function test( e ){ alert("div"); var evt = e || window.event; if(window.ActiveXObject){ evt.cancelBubble = true; }else{ evt.stopPropagation(); }

}

function test1(){

alert("body");

}

</script>

事件:

在ie中,window.event直接得到事件,不需要参数;而在fireFox中,需要传递参数event 例如:onlick(myEvent(event));

Function myEvent( e ){

Var myevent = e || window.event;//这也可以判断浏览器

Alert(myevent.type);

}

//取事件对象

function eventHander(evt) {

if(! evt) { evt = window.event; }

//或 var e = evt || window.event;

js事件总结

鼠标事件

js事件总结

js事件总结

click,dblclick,mousedown,mouseout,mouseover,mouseup,mousemove

事件对象(event)的属性:

js事件总结

type属性://获取当前事件类型,如

js事件总结

click

target(DOM) 或 srcElement(IE)属性//触发事件的对象

js事件总结

currentTarget(DOM): //正在处理事件的节点,在第1和第3阶段时,与target不同 例如:

js事件总结

alert(evt.currentTarget.nodeName);

bubbles:布尔值,声明该事件是否在文档树中起泡

js事件总结

cancelable:布尔值,声明该事件是否能用preventDefault()取消默认动作

获得鼠标事件:

<input type="button" onclick="test(event)" value="tijiao"/>

function test( e ){

var evt = e || window.event;

if(window.ActiveXObject){

evt.cancelBubble = true;

alert(evt.srcElement.value); //tijiao

}else{

evt.stopPropagation();

alert(evt.target.value); //tijiao

}

}

//在页面加载后,将页面中input标签都添加onclick事件:

function init(){

var ary = document.getElementsByTagName("input");

for(var i =0; i<ary.length;i++){

if(window.attachEvent){

ary[i].attachEvent("onclick",doClick);

}else{

ary[i].addEventListener("click",doClick,false); }

}

}

function doClick(evt){

var src;

if(window.ActiveXObject){

src = window.event.srcElement;

}else{

src = evt.target;

}

alert(src.value +"is clicked");

}

window.onload = init;

得到鼠标在屏幕的位置:

<input type=”text” id=”mousX”/>

Function getX( e ){

Var myevent = e || window.event;

Document.getElementById(“mousX”).value = myevent.x;

}

Window.event.srcElement.nodeName;//得到被触发标签的名字

Window.event.button //得到鼠标点了哪个键 1左键 2 右键 4 中间键

Document.相应事件 = 方法名;//此方法就可有相应的事件去触发相应的方法

Document.onkeydown //按键盘时触发

Document.onkeydown = getX;

相关推荐