<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script src="js/jquery-1.8.0.min.js"></script>
<script>
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("");
});
});
</script>
<style>
#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;
}
</style>
<body>
<div id="home">
<h1>用户登陆</h1>
<div id="head">
<form action="biaodan.html" name="regform" method="post" >
<dl class="dl1">
<dt>用户名 : </dt>
<dd><input type="text" name="uname"/></dd>
<dd id="erroruname"></dd>
</dl>
<dl class="dl1">
<dt>密码 : </dt>
<dd><input type="password"/></dd>
<dd id="errorpass"></dd>
</dl>
</div>
<div id="foot">
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
</div>
</form>
</div>
</body>
</html>

运行截图

用户登陆界面(jquery)的更多相关文章

  1. Win7如何取消用户登陆界面

    Window取消用户登陆界面 用户已设置密码状态下:删除密码即可. 用户无密码状态下: 运行 → control userpasswords2 → 找到“要使用本机,用户必须输入用户名与密码”这一项, ...

  2. 2017.10.20 jsp用户登陆界面连接数据库

    用户登陆界面 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8 ...

  3. 用java写一个用户登陆界面

    一.课堂测试源代码及其结果截图 用java的swing写一个用户登录界面,采用网格布局.源代码如下: /** * */package LiuLijia; import java.awt.CardLay ...

  4. WDA演练一:用户登陆界面设计(二)

    一,登陆界面设计: 1.将系统编号灰显,默认初值 2.密码栏勾选密码显示,这样就不会明文显示在页面上了: Init方法中添加默认值代码: METHOD wddoinit . DATA lo_nd_zh ...

  5. WDA演练一:用户登陆界面设计(一)

    一,新建用户表: 用户和密码参考标准的.这里给用户分了几个维度,以便后面进行接下来的业务设定. 二,新建ZLY_PORTAL 程序. 除了MAIN视图外,在添加LOGON视图. 1.导入预先做好的主页 ...

  6. [Django]登陆界面以及用户登入登出权限

    前言:简单的登陆界面展现,以及用户登陆登出,最后用户权限的问题 正文: 首先需要在settings.py设置ROOT_URLCONF,默认值为: ROOT_URLCONF  = 'www.urls'# ...

  7. 三层架构下实现用户登陆C#

    上篇文章讲到三层.接下来就通过一个实例详细的看怎么用三层实现用户登陆界面. 一.Model实体(LoginModel): namespace LoginModel { //加入类:UserInfo M ...

  8. 基于Oracle数据库登陆界面及功能实现 Java版

    首先要在Oracle数据库创建表文件,包括建立表头以及关键字(唯一标识符),此次程序所用的表名称为SW_USER_INFO,表头有UNAME.UKEY.USEX等,关键字为UCC,然后添加一条记录,用 ...

  9. alertDialog创建登陆界面,判断用户输入

    alertDialog创建登陆界面,需要获取用户输入的用户名和密码,获取控件对象的时候不能像主布局文件那样获得, 需要在onClickListener中获取,代码如下: public boolean ...

随机推荐

  1. bzoj 4827 [Hnoi2017] 礼物 —— FFT

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4827 首先,旋转对应,可以把 b 序列扩展成2倍,则 a 序列对应到的还是一段区间: 再把 ...

  2. Introduction to Multi-Threaded, Multi-Core and Parallel Programming concepts

    https://katyscode.wordpress.com/2013/05/17/introduction-to-multi-threaded-multi-core-and-parallel-pr ...

  3. java多线程知识点收集-总

    1.线程与进程的关系 进程(Process):当一个程序进入内存开始运行时,就产生一个进程.进程是一个独立单元,它的资源由系统分配和调度. 线程(Thread):线程是进程的执行单元,线程在进程中是独 ...

  4. throw UnsupportedOperationException

    package org.usc.action; import java.util.ArrayList; import java.util.Arrays; import java.util.List; ...

  5. HDU2444 【二分图判定+最大匹配】

    套模板很好的题? #include<bits/stdc++.h> using namespace std; const int N=2e2+10; const int M=4e4+10; ...

  6. memcached 命令详解

    memcached::get(); //查找key的值: 例:$mem->get($key): memcached::add() ; //添加,当key存在时,false,当key不存在则执行 ...

  7. game学习资源收集

    一些国外网站 游戏ai相关 http://aigamedev.com/ http://www.gdcvault.com/ http://www-cs-students.stanford.edu/~am ...

  8. uoj#275. 【清华集训2016】组合数问题(数位dp)

    传送门 假设有\(k|{n\choose m}\),因为\(n!\)中质因子\(k\)的次数为\(S(n)=\left\lfloor\frac{n}{k}\right\rfloor+\left\lfl ...

  9. 第三篇 Nosql讲解之windows下Memcached和Memcache的区别安装(二)

    一.Memcached和Memcache的区别: 网上关于Memcached和Memcache的区别的理解众说纷纭,我个人的理解是: Memcached是一个内存缓存系统,而Memcache是php的 ...

  10. CSS之html元素与body元素的范围