失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > jquery实现登录成功界面_jquery实现用户登陆界面(示例讲解)

jquery实现登录成功界面_jquery实现用户登陆界面(示例讲解)

时间:2022-09-20 00:47:07

相关推荐

jquery实现登录成功界面_jquery实现用户登陆界面(示例讲解)

实例如下所示:

var cnresu = false;

$(function(){

$("input[name='uname']").blur(function(){//blur从链接上移开焦点(鼠标离开框时)

var unamestr = $(this).val();

var regstr = /^[\u4e00-\u9fa5]{2,4}$/;

if(!regstr.test(unamestr)){

$(this).parent().next("dd").html("必须是2-4个汉字");

cnresu = false;

return;

}

cnresu = true;

});

$("input[name='uname']").focus(function(){//focus给予链接焦点(鼠标点中框时)

$(this).css("border","solid 1px #dddddd");

//$(this).val("");

$(this).parent().next("dd").html("");

});

});

#home{

width: 600px;

height: 300px;

margin: auto;

background-color: #7FFFD4;

}

#head{

padding-top: 20px;

height: 100px;

}

.dl1{

clear: both;

}

.dl1 dt{

float: left;

text-align: right;

width: 150px;

height: 30px;

line-height: 30px;

}

.dl1 dd{

float: left;

height: 30px;

line-height: 30px;

}

#foot{

text-align: center;

}

h1{

padding-top: 20px;

text-align: center;

color: bisque;

}

用户登陆

用户名 : 密码 :

运行截图

以上这篇jquery实现用户登陆界面(示例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

如果觉得《jquery实现登录成功界面_jquery实现用户登陆界面(示例讲解)》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。