用户表单事件(focus事件)
以前做用户系统的时候经常用到表单验证,正则表达式事件来处理和绑定事件和进行事件,这里说的其实只是一小部分,也不是很值得写,但是今天遇到了还是写一下,毕竟基础还是蛮重要的,就算懂的童鞋,巩固一下也是好的.
focus事件包括focusin事件和focusout事件.
focusin事件指绑定focus事件之后触发焦点获取焦点的事件。
focusout事件指绑定focus事件之后触发焦点之后丢失焦点的同时触发的事件.
举个例子:
要求:
用户中心有姓名和年纪,输入姓名和年纪,如果没有输入且为空时,鼠标离开input时会有提示(文本提示).
HTML代码:
<div class="dom">
<input type="text" name="name" > //姓名
</div>
<div class="dom">
<input type="text" name="ago" > //年纪
</div>
<div class="result"></div>
CSS样式
。。。 //这里我就不写了,高宽什么的
JS代码:
//引入jq版本文件
var inputText = {'name':'姓名','ago':'年纪'} //赋予对应的值
$('.dom').focusout(inputText,function(event){
var inputCanshu = event.data;
var inputContent = $(this).children(":text"); //获取内容
var inputName = inputContent.attr("name"); //内容添加name值
var res= ' ';
if(!inputContent.val()){ //判断内容是否为空
res = inputCanshu[inputName]="不能为空!"; //调用参数数组的内容
}
$(".result").html(res);
});
其实运行起来也是挺容易的,多写几遍就懂了,随手写的。
人是铁饭是钢,一顿不吃饿得慌!
用户表单事件(focus事件)的更多相关文章
- 使用 elementUI 的表单进行查询,表单中只有一个文本框时,回车会自动触发表单的提交事件,导致页面的刷新。
使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...
- python简单实现用户表单登录
实现简单的用户表单验证登录 user="desperado" pwd=" s=0 for i in range(10): if s < 3: username = ...
- JSP 用户表单的简单实现
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...
- form表单验证和事件、正则表达式
1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...
- 2016年11月6日--form表单验证和事件、正则表达式
1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...
- form表单验证和事件
1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...
- HTML 表单和验证事件
1.表单验证<form></form> (1)非空验证(去空格) (2)对比验证(跟一个值对比) (3)范围验证(根据一个范围进行判断) (4)固定格式验证:电话号码,身份证号 ...
- 表单和验证事件以及marquee标签
1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...
- python_way day17 jQuery表单验证,事件绑定,插件,文本框架,正则表达式
python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...
随机推荐
- Ubuntu server 修改系统时区
执行命令: sudo dpkg-reconfigure tzdata
- DropDownList年份的添加
http://blog.sina.com.cn/s/blog_4b9e030e01007sc3.html
- AJAX使用说明书 基础
AJAX简介 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异 ...
- lintcode - 删除数字
class Solution { public: /* * @param A: A positive integer which has N digits, A is a string * @para ...
- js删除数组中的 "NaN"
[注意] js中的NaN不和任何值相等,包括自身 所以可以使用 x!=x 来判断x是否是NaN,当且仅当x为NaN时,表达式的结果为true NaN != NaN ; //true 可以依此删除数组中 ...
- saltstack一键部署高可用
一健推送apache [root@server1 minions]# cd /etc/salt/ [root@server1 salt]# vim master [root@server1 salt] ...
- hive取等分数据
%sql select t3.* from ( select t2.* ,row_number() over(partition by t2.pt order by t2.pv) as rn2 fro ...
- Modbus协议学习笔记
之前也有写过基于 Modbus 通讯协议的控制远程监控程序,但是由于当时时间赶.人手少(软硬件前后台都是在下一人
- my.资料__2017暑假
1.http://tieba.baidu.com/p/5254412093 http://www.pipaw.com/mhxy/345616.html [落英缤纷的树下] 地址:长寿村123,24 [ ...
- Choose and divide(唯一分解定理)
首先说一下什么是唯一分解定理 唯一分解定理:任何一个大于1的自然数N,如果N不是质数,那么N可以分解成有限个素数的乘积:例:N=(p1^a1)*(p2^a2)*(p3^a3)......其中p1< ...