正文
jquery登录验证,jquery实现登录验证
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
急急！！运用JQuery写个简单的JavaScript，要求是登陆验证的。”
script type="text/javascript" src="../script/jquery.js"/script
script type="text/javascript"
$(function(){
//刷新验证码
$('#imgcode')
.click(
function(){
$(this).attr('src','code.asp?t='+Math.random());
}
);
//验证登陆
$('#login').submit(function(){checkLogin();return false;});
});
//验证登陆
function checkLogin()
{
if ($('#userid').val()==''){$('#userid').focus();return false;}
if ($('#password').val()==''){$('#password').focus();return false;}
if ($('#code').val()==''){$('#code').focus();return false;}
$.ajax
({
type :'POST',
url :'log.asp?action=login',
data :'userid='+$('#userid').val()+'password='+$('#password').val()+'code='+$('#code').val(),
success :function($str)
{
switch($str)
{
case '验证码错误':
alert($str);
$('#code').val('').focus();
break;
case '账号错误':
alert($str);
$('#userid').val('').focus();
break;
case '密码错误':
alert($str);
$('#password').val('').focus();
break;
case '登陆成功':
location.href="../manage.asp";
break;
default:
alert('未知错误\n\n'+$str);
}
}
});
return false;
}
/script
form id="login"
input id="userid" type="text" /
input id="password" type="password" /
input id="code" type="text" /
img id="imgcode" src="../inc/code.asp" /
input id="submit" type="submit" value="Login" /
/form
相关问答
Q1: 如何用jquery验证用户名密码是否一致
$("[password1]").val()==$("[password2]").val()。
也可使用jq的验证插件，百度一下然后去看看api
Q2: 如何使用jQuery的validate
一、使用Jquery.Validate进行验证方法
$(document).ready(function () {
$("#pageForm").validate({
rules: {
DictKey: { required: true, maxlength: 10 },
DictContent: { required: true, maxlength: 10 }
},
messages: {
DictKey: { required: "不能为空", maxlength: jQuery.format("不能超过{0}个字符") },
DictContent: { required: "不能为空", maxlength: jQuery.format("不能超过{0}个字符") }
},
submitHandler: function (form) {
form.submit();
}
})
})
DictKey ，DictContent：指需要验证的控件ID
submitHandler ：指通过验证后运行的函数，里面写入表单要提交的函数，否则表单不会提交
二、列出常用默认验证规则
(1)required:true 必输字段
(2)email:true 必须输入正确格式的电子邮件
(3)url:true 必须输入正确格式的网址
(4)date:true 必须输入正确格式的日期
(5)dateISO:true 必须输入正确格式的日期(ISO)，例如：2009-06-23，1998/01/22 只验证格式，不验证有效性
(6)number:true 必须输入合法的数字(负数，小数)
(7)digits:true 必须输入整数
(8)creditcard: 必须输入合法的信用卡号
(9)equalTo:"#field" 输入值必须和#field相同
(10)accept: 输入拥有合法后缀名的字符串（上传文件的后缀）
(11)maxlength:5 输入长度最多是5的字符串(汉字算一个字符)
(12)minlength:10 输入长度最小是10的字符串(汉字算一个字符)
(13)rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
(14) equalLength:10 输入长度必须是10
(14)range:[5,10] 输入值必须介于 5 和 10 之间
(15)max:5 输入值不能大于5
(16)min:10 输入值不能小于10
三、使用ajax方法验证输入值是否存在
当文本框输入值时，或改变输入值时会自动到Server去验证输入值是否在数据库中存在
JS代码如下：
DictKey: { required: true, maxlength: 10,
remote: { //验证用户名是否存在
type: "POST",
url: '@Url.Content("~/Account/Test/")' //servlet
}
},
DictKey: { required: "不能为空", maxlength: jQuery.format("不能超过{0}个字符"),remote:"用户名已被注册"},
Server端：
[HttpPost]
public JsonResult Test(string DictKey) //DictKey即要验证控件的ID值
{
bool result;
if (DictKey == "a")
{
result = true;
}
else
{
result = false;
}
return Json(result);
}
根据Server端返回的True,False来决定验证是否通过
四、非submit按钮结合Jquery.Form进行提交
如果不是submit提交按钮，比如单击某个按钮触发表单验证，这时表单验证可用如下方式
function validateForm() {
//validate方法参数可选
return $("#form1").validate({
rules: {
},
messages:{
}
}).form();
}
function doSubmit(){
//do other things
//验证通过后提交
if(validateForm()){
form.submit()
//这边可以结合Jquery.Form进行AjaxSubmit方式异步提交
$("#UpdateForm").AjaxSubmit (function(){
Alert(“AjaxForm提交完成”)
});
}
}
Q3: jquery点击某个元素后判断用户是否登录
div id="parent"
a id="a1" href="javascript:void(0);"点我/a
a id="a2" href="javascript:void(0);"点我吧/a
input id="b1" type="button" value="还是点我"/input
input id="b2" type="button" value="那点你吧"/input
/div
$("#parent *").click(function(e){
if(e.target == $("#a1")[0]){
alert("你点了链接一！");
}else if(e.target == $("#a2")[0]){
alert("你点了链接二！");
}else if(e.target == $("#b1")[0]){
alert("你点了按钮一！");
}else if(e.target == $("#b2")[0]){
alert("你点了按钮二！");
}
});
可以试试我这个，因为jQuery选择器的原因，所以一定要指定父级，否则会执行多次。
Q4: 我用jquery做登录界面时，点击登录按钮，怎样才能实现上面输入框的内容全部都合法，否则进不到下一个页面
//这是提交登录表单的方法
function submitForm(){
if(validate()){ //这么写表示通过所有验证
//正式提交表单，可以用$("#表单ID").submit();
}
}
//这是验证的方法
function validate(){
var isTrue = true;
//如果验证不通过，就把isTrue设为false并return isTrue
}
写个button按钮，直接调用submitForm()方法即可。楼主还有什么不懂的尽管问我！
Q5: jquery简单密码验证
1. 先写判断函数
var passmode = function(a) {//计算密码组合种类
var num = 0;
if(/[0-9]+/.test(a)) num++
if(/[a-zA-Z]+/.test(a)) num++
if(/[^0-9a-zA-Z\s\u4e00-\u9fa5]+/.test(a)) num++
return num;
};
2. 调用判断
$('#password').keyup(function () {
var password = $('#password').val().replace(/\s*/, "");
var passleng = password.length;
var _pass = passmode(password);
if (passleng 6) {//极弱，不考虑
return;
}
if(/(?:(.)\1{3,})/.test(password) _pass == 1) {
//任何字符重复3次以上，并密码字符种类只有一种，弱
$('#hint').css('background-color','#弱');
} else if(_pass == 2 || (!/(?:(.)\1{3,})/.test(password)passleng =6_pass == 1)) {
//密码种类超过6位存在两种 或 没有3次以上重复超过6位 中
$('#hint').css('background-color','#中');
} else if(_pass == 3){//不管是否重复字符，密码种类存在三种，长度大于等于6，强
$('#hint').css('background-color','#强');
}
}
);
