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事件
用事件来提示用户是否删除:
<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事件句柄
支持通过事件处理句柄函数返回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); }
在事件传播的过程中,通过事件对象设置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;
鼠标事件
click,dblclick,mousedown,mouseout,mouseover,mouseup,mousemove
事件对象(event)的属性:
type属性://获取当前事件类型,如
click
target(DOM) 或 srcElement(IE)属性//触发事件的对象
currentTarget(DOM): //正在处理事件的节点,在第1和第3阶段时,与target不同 例如:
alert(evt.currentTarget.nodeName);
bubbles:布尔值,声明该事件是否在文档树中起泡
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;
JavaScript语法:1、区分大小写2、变量弱类型:varPrompt提示用户输入内容访问节点:(标签)js中通过调用varo…
Html5总结首先在需要的页面加入如下js和css就可以使用了ltviewport的meta标签将屏幕的宽度设置为了与设备的宽度相…
js知识点1javascript是因特网上最流行的脚本语言js必须运行在浏览器2javascript语言可以放置的位置bodyhe…
Js常用函数总结js提交表单及js表单验证20xx05092237js提交表单及js表单验证功能强大很多原本需要在服务器端实现的功…
JavaScript的内部对象1Object2String3Math4Date5toStringJavaScript代码放在另一个…
JavaScript语法:1、区分大小写2、变量弱类型:varPrompt提示用户输入内容访问节点:(标签)js中通过调用varo…
js实现弹窗效果代码总结,如:子窗口刷新父窗口.txt54就让昨日成流水,就让往事随风飞,今日的杯中别再盛着昨日的残痕;唯有珍惜现…
1、直接在前台调用javascript函数很简单,在head元素之间加入script元素,将type元素设置为text/javas…
、|!_一个人总要走陌生的路,看陌生的风景,听陌生的歌,然后在某个不经意的瞬间,你会发现,原本费尽心机想要忘记的事情真的就这么忘记…
前端是庞大的包括HTMLCSSJavascriptImageFlash等等各种各样的资源前端优化是复杂的针对方方面面的资源都有不同…