用户表单事件(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. ...
随机推荐
- Mock Server利器 - Moco
Moco介绍Moco独立运行所需环境如何运行Moco启动http服务启动https服务Moco HTTPs API配置如何在配置文件添加注释约定请求Body约定接口的uri约定请求参数约定请求方法约定 ...
- put get & push pull
总要有一个容器,一个生产方,一个消费方
- (转)Caffe搭建:常见问题解决办法和ubuntu使用中遇到问题(持续更新)
参考网址:http://www.cnblogs.com/empty16/p/4828476.html 严正声明: 在linux下面使用命令行操作时,一定要懂得命令行的意思,然后再执行,要不然在不知道接 ...
- thinkPHP 模板操作
1.assign赋值 $this->assign('title','模板操作'); $this->assign('bests',$bests);//$bests是二维数组 2.变量的输出 ...
- 4-----Scrapy框架中选择器的用法
Scrapy提取数据有自己的一套机制,被称作选择器(selectors),通过特定的Xpath或者CSS表达式来选择HTML文件的某个部分Xpath是专门在XML文件中选择节点的语言,也可以用在HTM ...
- getopt 学习
https://www.cnblogs.com/qingergege/p/5914218.html
- python面向对象实例
——王宇阳 总结 (Code_boy)2018年11月16日 class Person: name='xxx' age=20 p=Person() #p为实例对象 print(p.name,p.age ...
- 5W1H
WHY ——为什么做?原因与目标 WHAT ——做什么?目标与内容 WHO ——谁去做?具体的执行者 WHEN ——什么时间做?执行时间 WHERE——在什么地方做?执行地点 HOW——怎样做 ...
- RTT之内核服务函数
一 延时函数: rt_thread_delay(t) //调用时进入系统调度. rt_kprintf()函数在kservice.c中实现,如果不使用设备驱动,则由自定义函数void rt_hw_con ...
- Monkey King(左偏树 可并堆)
我们知道如果要我们给一个序列排序,按照某种大小顺序关系,我们很容易想到优先队列,的确很方便,但是优先队列也有解决不了的问题,当题目要求你把两个优先队列合并的时候,这就实现不了了 优先队列只有插入 删除 ...