onsubmit表单验证

<script type="text/javascript">
function check(){
    var username=document.getElementById(‘username‘);
    var password=document.getElementById(‘password‘);
    //防止用户输入空格也验证通过
    if (!(username.value.replace(/\s*/g,‘‘)&&password.value.replace(/\s*/g,‘‘))){
        username.focus();
        return false;
    }else{
        //document.forms[0].login.disabled=true;
        document.getElementById(‘login‘).disabled=true;
        document.getElementById(‘login‘).value=‘登录中‘;
        return true;
    }
}
</script>

<form action="test.php" method="get" id="test" onsubmit="return check()">
<label for="username">用户名 : </label><input id=‘username‘ name="username" type="text" />
<label for="password">密 码 : </label><input id="password" name="password" type="password"/>
<input type="submit" value="登陆" id="login" name="login" />
</form>

<!--<button type="submit">提交</button>
下面的默认不会触发onsubmit()事件
<input type=‘button‘ value=‘提交‘/>
<button onclick="_submit()">提交</button>-->

非行间事件的写法

var obj = document.getElementById(‘myform‘);
var check = function(){
    var username=document.getElementById(‘username‘);
    var password=document.getElementById(‘password‘);
    if (!(username.value.replace(/\s*/g,‘‘)&&password.value.replace(/\s*/g,‘‘))){
        return false;
    }else{
        return true;
    }
}
obj.onsubmit = function(){
return check();
}

// 这样写不能实现阻止表单提交
// obj.onsubmit = function(){
//     var username=document.getElementById(‘username‘);
//     var password=document.getElementById(‘password‘);
//     if (!(username.value.replace(/\s*/g,‘‘)&&password.value.replace(/\s*/g,‘‘))){
//         return false;
//     }else{
//         return true;
//     }
// }

时间: 2024-10-11 19:11:32

onsubmit表单验证的相关文章

[js]js的表单验证onsubmit方法

http://uule.iteye.com/blog/2183622 表单验证类 <form class="form" method="post" id="form" onsubmit="return checkForm(this)" action=""> 电话号码:<input id="tel" type="text" maxlength=&quo

java 表单验证

1.思路:通过表单选择器,表单属性过滤器提取每个表单提交的值,进行验证 2.实现:javascript通过 onSubmit()事件,判断,返回值false不提交,返回true提交,jquery通过submit()事件 3.表单验证常用的方法和事件 a:事件 onblur 失去焦点, onfocus获得焦点 b:方法 blur() 移开焦点触发方法参数 focus() 在文本域中设置焦点 触发方法参数 select()选取文本域中的内容触发方法参数 4.正则表达式: a:定义 var reg =

第一篇,js表单验证模板

下面是对于一个email的表单验证的基本模板<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <style type="text/css" > .init{ border: 1px solid black; font-weight: bold; } .right{ border: 1px solid green; f

JS表单验证类HTML代码实例

以前用的比较多的一个JS表单验证类,对于个人来说已经够用了,有兴趣的可以在此基础上扩展成ajax版本.本表单验证类囊括了密码验证.英文4~10个 字符验证. 中文非空验证.大于10小于100的数字.浮点数验证.日期验证.邮件检查.网址验证.固定电话和手机号码验证.IP地址验证.邮编和QQ号码验证. MSN和身份证验证等. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

好用的表单验证插件

在做项目过程中,使用了jquery的一个验证表单的插件--jquery validation.这里简单整理了一下这个强大的表单验证插件的一些常用的方法,以及在使用过程中需要注意的地方. 首先要想使用,首先需要引入jquery,然后引入jquery validation两个文件.然后通过插件的初始化方法,进行初始化,之后就可以按照自己的需要进行使用了. //引入jquery,版本1.6+ <script type="text/javascript" src="http:/

jquery.validation.js 表单验证

jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 一导入js库 <script src="../js/jquery.js" type="text/javascript"></script> <script src="../js/jq

jQuery插件——Validation Plugin表单验证

jQuery表单验证插件:https://plugins.jquery.com/tag/validate/ jQuery Validation插件是最常用的插件之一:http://jqueryvalidation.org/ 一.基本API rules里面的“username”是input中的“name”,不是“id”. 表单验证,主要是俩:一是规则,二是提示信息 当在使用validate插件的时候: 使用validate()方法的时候将debug设置为true,那么表单不会提交,只进行检查,调试

JS表单验证-12个常用的JS表单验证

最近有个项目用到了表单验证,小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下,和大家一起分享~~~ 1. 长度限制 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 6

jQuery Validate 插件,表单验证功能

连接地址:http://www.w3cschool.cc/jquery/jquery-plugin-validate.html jQuery Validate jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来编写用户自定义方法的 API.所有的捆绑方法默认使用英语作为错误信息,且已翻译成其他 37 种语言. 该插件是由 Jör