在使用jQuery绑定事件时，若某个事件不存在，则该事件后 绑定的事件均失效：

如图所示，若失去焦点事件checkEmail不存在， 会导致后面的事件checkMobile,和事件checkBirth均失效

完整代码如下：

 <!doctype html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

 <title>使用正则表达式验证注册页面</title>

     <link rel="stylesheet" href="css/register.css">

 </head>

 <body>

 <section id="register">

     <div><img src="data:images/logo.jpg" alt="logo" /><img src="data:images/banner.jpg" alt="banner" /></div>

     <h1 class="hr_1">新用户注册</h1>

     <form action="" method="post" name="myform">

         <dl>

             <dt>用户名：</dt>

             <dd><input id="user" type="text" /><div id="user_prompt">用户名由英文字母和数字组成的4-16位字符，以字母开头</div></dd>

         </dl>

         <dl>

             <dt>密码：</dt>

             <dd><input id="pwd" type="password"  /><div id="pwd_prompt">密码由英文字母和数字组成的4-10位字符</div></dd>

         </dl>

         <dl>

             <dt>确认密码：</dt>

             <dd><input id="repwd" type="password"/><div id="repwd_prompt"></div></dd>

         </dl>

         <dl>

             <dt>电子邮箱：</dt>

             <dd><input id="email" type="text"/><div id="email_prompt"></div></dd>

         </dl>

         <dl>

             <dt>手机号码：</dt>

             <dd><input id="mobile" type="text" /><div id="mobile_prompt"></div></dd>

         </dl>

         <dl>

             <dt>生日：</dt>

             <dd><input id="birth" type="text"/><div id="birth_prompt"></div></dd>

         </dl>

         <dl>

             <dt>&nbsp;</dt>

             <dd><input name="" type="image" src="data:images/register.jpg" class="btn" /></dd>

         </dl>

   </form>

 </section>

 <script src="js/jquery-1.12.4.js"></script>

 <script>

     $(document).ready(function(){

         //绑定失去焦点事件

         $("#user").blur(checkUser);

         $("#pwd").blur(checkPWD);

         $("#repwd").blur(checkRPWD);

         //$("#email").blur(checkEmail);          尝试取消注释，  看看会发生什么    （取消注释该语句后，事件checkMobile和事件checkBirth将不会输出事件中定义的报错信息）

         $("#mobile").blur(checkMobile);

         $("#birth").blur(checkBirth);

     })

     function checkUser(){

         var reg= /^[a-zA-Z]([a-zA-Z0-9]{3,15})$/;

         if(reg.test($("#user").val()) == false){

             $("#user_prompt").html('请输入正确的用户名');

             $('#user').focus();

             return false;

         }

         $("#user_prompt").html('');

         return true;

     }

     function checkPWD(){

         var reg = /^[a-zA-Z0-9]{4,10}$/;

         if(reg.test($('#pwd').val())==false){

             $("#pwd_prompt").html('请输入正确的密码');

             $("#pwd").focus();

             return false;

         }

         $("#pwd_prompt").html("");

         return true;

     }

     function checkRPWD(){

         if($("#repwd").val() != $("#pwd").val()){

             $("#repwd_prompt").html("两次输入的密码不一致");

             $("#pwd").focus();

             return false;

         }

         $("#repwd_prompt").html('---');

         return true;

     }

     function checkMobile(){

         var reg = /^1\d{10}$/;

         if(reg.test($("#mobile").val()) == false){

             $("#mobile_prompt").html("请输入正确的手机号码");

             $("#mobile").focus();

             return false;

         }

          return true;

     }

     function checkBirth(){

         var reg = /^((19\d{2})|(200\d)|(201[0-6]))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/;

         if(reg.test($("#birth").val()) == false){

             $("#birth_prompt").html("请输入正确的生日格式");

             $("#birth").focus();

             return false;

         }

         $("#birth_prompt").html("--");

         return true;

         var birth = $(this).val();

         var reg = /^((19\d{2})|(200\d)|(201[0-6]))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])$/;

         if (reg.test(birth) == false) {

             $("#birth_prompt").html("生日格式不正确，例如1980-5-12或1988-05-04");

             return false;

         }

          return true;

     }

 </script>

 </body>

 </html>

如有大佬知道缘由，可在下方评论。

jQuery之绑定焦点事件（焦点事件失效）的更多相关文章

  1. jquery移除、绑定、触发元素事件使用示例详解

    这篇文章主要介绍了jquery移除.绑定.触发元素事件使用示例详解,需要的朋友可以参考下. unbind(type [,data]) //data是要移除的函数 $('#btn').unbind(&q ...

  2. jquery绑定input的change事件

    ### jquery绑定input的change事件 背景:在做一个登录页时,如果用户未输入验证码则无法点击登录按钮,所以想到了用input的change事件,但是在写完后发现无法监听input值的改 ...

  3. js 各种事件 如：点击事件、失去焦点、键盘事件等

    事件驱动:        我们点击按钮 按钮去掉用相应的方法.                demo:             <input type="button" v ...

  4. JQuery中绑定事件（bind()）和移除事件（unbind()）

    有时候事件执行完了,想取消事件的效果可以通过一定的办法来处理.比如bind()(绑定事件)和unbind()(移除通过bind()方法添加的事件)方法来移除事件的效果. 比如下面的一个案例: 复制代码 ...

  5. WPF双滑块控件以及强制捕获鼠标事件焦点

    效果 概述 最近有个小需求要用双滑块表示一个取值范围,于是就简单做了个用户控件,在此记录下. 使用矩形Rectangle表示范围,椭圆Ellipse表示滑块,使用Canvas控制滑块的左右移动. 椭圆 ...

  6. jquery on 绑定事件

    jquery on 绑定事件 1. 多个选择器绑定一个事件 2. 多个事件绑定一个函数 3. 一个选择器绑定多个事件,有两种写法: 或者 on只绑定一次事件,绑定父元素,防止初始化时数据未加载,绑定出 ...

  7. jQuery中绑定事件bind() on() live() one()的异同

    jQuery中绑定事件的四种方法,他们可以同时绑定一个或多个事件 bind()-------------------------版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也 ...

  8. jquery一次绑定多个元素事件

    jquery一次绑定多个元素事件 $(".peoplenum,input[name$='otherAmount'],#aa,#bb").bind("change" ...

  9. jQuery 事件绑定 和 JavaScript 原生事件绑定

    总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind.live.delegate.o ...

随机推荐

  1. Python爬取ithome的一所有新闻标题评论数及其他一些信息并存入Excel中。

    # coding=utf-8 import numpy as np import pandas as pd import sys from selenium import webdriver impo ...

  2. BeautifulSoup的基本使用

    一.将一段文档传入BeautifulSoup的构造方法,得到一个文档的对象: from bs4 import BeautifulSoup Soup = BeautifulSoup(html_doc) ...

  3. UOJ 34: 多项式乘法（FFT模板题）

    关于FFT 这个博客的讲解超级棒 http://blog.miskcoo.com/2015/04/polynomial-multiplication-and-fast-fourier-transfor ...

  4. [IOI2005]河流

    Description Luogu3354 Solution 一道树形dp的题. 首先考虑转移,很简单,就是这个点做不做伐木场.为了方便转移,我们定义状态为\(f_{i,j,k}\)表示点\(i\)及 ...

  5. X-Forwarded-For注入漏洞过程记录

    一.题目地址 https://www.mozhe.cn/bug/detail/QWxmdFFhVURDay90L0wxdmJXSkl5Zz09bW96aGUmozhe 二.使用工具 FireFox浏览 ...

  6. HBase记录

    本次记录是用于:SparkStreaming对接Kafka.HBase记录 一.基本概念 1.HBase以表的形式存储数据.表有行和列族组成.列族划分为若干个列.其结构如下 2.Row Key:行键 ...

  7. python numpy中sum()时出现负值

    import numpy a=numpy.random.randint(1, 4095, (5000,5000)) a.sum() 结果为负值, 这是错误的,a.sum()的类型为 int32,如何做 ...

  8. codeforces 962F.simple cycle（tarjan/点双连通分量）

    题目连接:http://codeforces.com/contest/962/problem/F 题目大意是定义一个simple cycle为从一个节点开始绕环走一遍能经过simple cycle内任 ...

  9. jmeter的使用---录制脚本

    1.设置fidder 2.在fidder中导出请求,选择jmx格式

  10. Mongodb学习笔记（三）性能篇

    一.索引管理 MongoDB提供了多样性的索引支持,索引信息被保存在system.indexes中MongoDB中_id字段在创建的时候,默认已经建立了索引,这个索引比较特殊,并且不可以删除,不过Ca ...