以前做用户系统的时候经常用到表单验证,正则表达式事件来处理和绑定事件和进行事件,这里说的其实只是一小部分,也不是很值得写,但是今天遇到了还是写一下,毕竟基础还是蛮重要的,就算懂的童鞋,巩固一下也是好的.

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事件)的更多相关文章

  1. 使用 elementUI 的表单进行查询,表单中只有一个文本框时,回车会自动触发表单的提交事件,导致页面的刷新。

    使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...

  2. python简单实现用户表单登录

    实现简单的用户表单验证登录 user="desperado" pwd=" s=0 for i in range(10): if s < 3: username = ...

  3. JSP 用户表单的简单实现

    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...

  4. form表单验证和事件、正则表达式

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  5. 2016年11月6日--form表单验证和事件、正则表达式

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  6. form表单验证和事件

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  7. HTML 表单和验证事件

    1.表单验证<form></form> (1)非空验证(去空格) (2)对比验证(跟一个值对比) (3)范围验证(根据一个范围进行判断) (4)固定格式验证:电话号码,身份证号 ...

  8. 表单和验证事件以及marquee标签

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  9. python_way day17 jQuery表单验证,事件绑定,插件,文本框架,正则表达式

    python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...

随机推荐

  1. Mock Server利器 - Moco

    Moco介绍Moco独立运行所需环境如何运行Moco启动http服务启动https服务Moco HTTPs API配置如何在配置文件添加注释约定请求Body约定接口的uri约定请求参数约定请求方法约定 ...

  2. put get & push pull

    总要有一个容器,一个生产方,一个消费方

  3. (转)Caffe搭建:常见问题解决办法和ubuntu使用中遇到问题(持续更新)

    参考网址:http://www.cnblogs.com/empty16/p/4828476.html 严正声明: 在linux下面使用命令行操作时,一定要懂得命令行的意思,然后再执行,要不然在不知道接 ...

  4. thinkPHP 模板操作

    1.assign赋值 $this->assign('title','模板操作'); $this->assign('bests',$bests);//$bests是二维数组 2.变量的输出 ...

  5. 4-----Scrapy框架中选择器的用法

    Scrapy提取数据有自己的一套机制,被称作选择器(selectors),通过特定的Xpath或者CSS表达式来选择HTML文件的某个部分Xpath是专门在XML文件中选择节点的语言,也可以用在HTM ...

  6. getopt 学习

    https://www.cnblogs.com/qingergege/p/5914218.html

  7. python面向对象实例

    ——王宇阳 总结 (Code_boy)2018年11月16日 class Person: name='xxx' age=20 p=Person() #p为实例对象 print(p.name,p.age ...

  8. 5W1H

    WHY   ——为什么做?原因与目标 WHAT ——做什么?目标与内容 WHO   ——谁去做?具体的执行者 WHEN ——什么时间做?执行时间 WHERE——在什么地方做?执行地点 HOW——怎样做 ...

  9. RTT之内核服务函数

    一 延时函数: rt_thread_delay(t) //调用时进入系统调度. rt_kprintf()函数在kservice.c中实现,如果不使用设备驱动,则由自定义函数void rt_hw_con ...

  10. Monkey King(左偏树 可并堆)

    我们知道如果要我们给一个序列排序,按照某种大小顺序关系,我们很容易想到优先队列,的确很方便,但是优先队列也有解决不了的问题,当题目要求你把两个优先队列合并的时候,这就实现不了了 优先队列只有插入 删除 ...