用户表单事件(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. ...
随机推荐
- [Android UI]View滑动方式总结
一.前言 在上一篇文章,介绍了View的坐标等基础知识,有了基础知识后,对下面内容的理解也将会容易很多.那么本文介绍的是View滑动的几种方式,这对于View来说,也是需要重要掌握的内容,因为用户无时 ...
- 编译安装libimobiledevice
在windows上大家可以使用iTunes来与iPhone进行通信,但是Linux上没有这类的官方软件,所以一些爱好者就破解了iTunes的通信协议,然后在Linux上实现了该协议,也就是libimo ...
- oracle wm_concat函数 列转行 分组函数
(1)select mark, wm_concat(status) from DISSENT_INFO t GROUP BY mark; 查出来的数据 mark status 222 ...
- MOS管
mos工作原理:http://www.360doc.com/content/15/0930/11/28009762_502419576.shtml, 开关特性好,长用于开关电源马达驱动,CMOS相机场 ...
- VS 快速插入无参构造器
输入ctor后 点击两次Tab键,即可快速插入无参构造器.
- (转)Linux系统排查4——网络篇
原文:http://www.cnblogs.com/Security-Darren/p/4700387.html 用于排查Linux系统的网络故障. 网络排查一般是有一定的思路和顺序的,其实排查的思路 ...
- 用Windows Live Writer离线写博客
作为CSDN博客的菜鸟,我发现在线写博客很不方便,而且文字编辑也不方便,比如不能傻瓜化地修改字体和颜色."有志者自有千方百计,无志者只感千难万难."一番搜索后,我发现了Window ...
- genymotion安装及使用出现的问题
此处总结genymotion出现的问题. 1)安装好genymotion后,新建一个模拟器.去下载的时候报错 Unable to create Virtual Device: Connection t ...
- 如何解读IL代码
如何解读IL代码 关于IL代码,我有将从三个方面去揭开它神秘的面纱.IL代码是什么?我们为什么要去读懂IL代码?我们如何去读懂IL代码?这三个问题的解答,将是我解读IL代码的整体思路. IL代码是什么 ...
- weblogic 10.3.5重置密码
weblogic 10.3.5重置密码 热度1,609 ℃ 时间:2013-12-26 10:26 分类:middleware 评论数:0 条 0 weblogic默认验证密码机制:如 ...