既然使用了trigger和triggerHandler,那么你应该了解了他们的差别了。

trigger():在每一个匹配的元素上触发某类事件。

triggerHandler():这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。

看似两个非常相似,但是表同里不同!

下面就是他们之间的三大区别:

  第一:trigger会导致浏览器同名的默认行为的执行,如:trigger('submit');不但会执行submit()函数的效果,也会执行表单提交的效果;

     而triggerHandler就不会导致默认行为的执行

  第二:triggerHandler只会触发JQ对象集合中第一个元素的事件处理函数,也不会产生事件冒泡。而trigger不同

  第三:这个方法的返回时事件处理函数的返回值,而不是具有可链性的JQ对象,此外,如果最开始的JQ对象集合为空,则返回undefined.

  特别是第二条,关于这个bug的 ticket。关于这个问题的 commit。jQuery自己实现了一个event对象用于解决浏览器间的差异问题。可是由于有mouseenter/mouseleave等非标准事件的存在,jQuery引入了special事件的子系统,让原生事件回到模拟事件的事件列队中,可是这个系统并不能解决所有问题,当使用trigger.focus时,IE下会错误地执行两次回调。

  triggerHandler是对trigger产生这种问题的解决方法。但是使用triggerHandler时你会发现input是没有光标focus效果的。

  

解决方法

  除了用triggerHandler另一个方法是在focus绑定事件中加上event.preventDefault()。

  可是你发现这不符合我们的期望呀,因为focus事件回调执行了,但是连个focus效果都没有。

最终解决方法

  既然是jQuery封装的关系,那我们用原生的事件就可以了。看演示,左边是用原生事件触发的,右边用triggerHandler。

  $('input')[0].focus();

  

JQ中 trigger()和triggerHandler()区别的更多相关文章

  1. 【jQuery】【转】jQuery中的trigger和triggerHandler区别

    trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...

  2. jquery的trigger和triggerHandler区别

    网上关于这个问题都是抄来抄去的,都没怎么说清楚.所以自己做了个测试,供大家参考指教.首先先看API怎么说的 为了检验一下,编写了一个简单的测试代码,如下: <html lang="en ...

  3. jQuery中的trigger和triggerhandler区别

    $("form :input").blur(function(){ // }).keyup(function(){ $(this).triggerHandler("blu ...

  4. JQ中mouseover和mouseenter的区别

    我最近也在学习JQuery,所以最近对JQ中的一些小问题进行总结,方便学习. 在对于刚开始学习JQ的初学者来说,mouseover事件和mouseenter事件总是傻傻分不清楚,毕竟刚开始学习的时候, ...

  5. JQ中$(window).load和$(document).ready区别与执行顺序

    JQ中的$(document).ready()大家应该用的非常多,等同于$(function(){}),基本每个JS脚本中都有这个函数的出现有时甚至会出现多个,那么另一个加载函数$(window).l ...

  6. [转]JQ中$(window).load和$(document).ready区别与执行顺序

    一.$(window).load().window.onload=function(){}和$(document).ready()方法的区别 1.$(window).load() 和window.on ...

  7. jq中append()、prepend()、after()、before()的区别

    jq中append().prepend().after().before()的区别详解 .append() - 在被选元素的结尾插入内容(内容的结尾,比如说有个a标签,则是在</a>这个标 ...

  8. JS模式:jq中简单的模式--》采摘自js设计(tomxu_version)

    <!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...

  9. trigger和triggerHandler的使用

    今天琢磨了好久这个trigger和triggerHandler的用法.在网上搜了好多,不过大都是相互抄袭,毛意思都没有.后来自己做了研究. trigger: 1.可以用来触发事件. <input ...

随机推荐

  1. 剑指offer题目1-10

    面试题3:二维数组中的查找 public class Solution { public boolean Find(int [][] array,int target) { boolean isFou ...

  2. Python网络爬虫Scrapy框架研究

    看到一个爬虫比较完整的教程.保留一下. https://github.com/yidao620c/core-scrapy

  3. 基于选择重传ARQ传输协议的数据重传机制方案设计

    原文链接: http://blog.csdn.net/pinghegood/article/details/7841281  1.背景 最近在项目中,由于使用TD网络传输数据,数据掉包严重,软件组老大 ...

  4. string.Format , object[] args 使用

    string sql = "insert into TableA values('{0}','{1}','{2}',GetDate(),'{3}' "; sql = string. ...

  5. 手拼Table 前台显示

    一:前台 <table border=</table> 二:后台 //表头 public void TABTITLE() { TblList.Rows.Clear(); HtmlTa ...

  6. JS 插件使用

    1.时间控件的使用 My97DatePicker WdatePicker({ minDate: '%y-%M-{%d}'}) 默认当前日期以后 LoanMessage.LoanAppAgentMode ...

  7. Java 第十章 类和对象

    类和对象 类与对象的关系是什么? 答 :类是具有相同属性和方法的一组对象的集合. 类是抽象的,对象是具体的:类是对象的模版,对象是类的实例. 定义一个类的语法是什么? public class 类名{ ...

  8. maven错误:Project configuration is not up-to-date with pom.xml

    原因: 1.导入maven工程后,出现如下错误: Description    Resource    Path    Location    TypeProject configuration is ...

  9. python语法快速入门(1)

    http://www.runoob.com/python/python-tutorial.html Python 是一种解释型语言: 这意味着开发过程中没有了编译这个环节.类似于PHP和Perl语言 ...

  10. String reorder

    本问题出自:微软2014实习生及秋令营技术类职位在线测试 (Microsoft Online Test for Core Technical Positions) Description For th ...