jQuery中trigger()与bind()用法分析

更新时间：2015年12月18日 15:35:21 作者：匆匆夏日

这篇文章主要介绍了jQuery中trigger()与bind()用法,结合实例形式分析了trigger()与bind()的功能、定义及具体使用技巧,需要的朋友可以参考下

本文实例讲述了jQuery中 trigger()与bind()用法。分享给大家供大家参考，具体如下：

trigger(type)

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

返回值:jQuery

参数:

type (String): 要触发的事件类型

示例:

复制代码代码如下:

$("p").trigger("click")

1.trigger() 触发事件

这个方法是jQuery 1.3中新增的一个引起触发事件的函数。
这里的事件就如jQuery的帮助文档中的事件那一栏，如：click, mouseover, keydown 等有动作的js事件，而像show, hide这是效果不是事件。

2.为什么要用 trigger() ？

相信刚开始接触大家也都有这样的想法?

比如前台页面里有：<p id="p1">请点击这里！</p>
你希望加载页面时就执行这个事件给这个这p绑定了click事件（将下面的代码写在$(function(){});里面）：

$("#p1").click(function(){
  alert("hello!");
});

如果用trigger()，你就要写成这样：

$("#p1").click(function(){
  alert("hello!");
}).trigger(click);

这样写不是更加麻烦了吗？可以这么说，但是用trigger()最大的好处就是它是可以传递参数进去的。例如：

//myEvent为自定义事件名
$("#p1").bind("myEvent",function(event,str1,str2) {
  alert(str1 + ' ' + str2); 
});
$("#p1").trigger("myEvent",["Hello","World"]);

也可以这样写：

$("#p1").bind("myEvent",function(event,str1,str2) {
  alert(str1 + ' ' + str2);
}).trigger("myEvent",["Hello","World"]);

希望本文所述对大家jQuery程序设计有所帮助。

您可能感兴趣的文章:

基于jQuery ligerUI实现分页样式
这篇文章主要为大家详细介绍了基于jQuery ligerUI实现分页样式,具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-09-09
jquery插件之文字间歇自动向上滚动效果代码
这篇文章主要介绍了jquery插件之文字间歇自动向上滚动效果代码,涉及jquery基于时间函数定时触发页面元素变换实现滚动效果的相关技巧,需要的朋友可以参考下
2016-02-02
Javascript 验证上传图片大小[客户端]
在做上传图片的时候，如果不限制上传图片大小，后果非常的严重。那么我们怎样才可以解决一个棘手的问题呢？
2009-08-08
jquery.validate表单验证插件使用详解
这篇文章主要为大家详细介绍了jquery.validate表单验证插件的使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-06-06
jq实现酷炫的鼠标经过图片翻滚效果
一个酷炫的图片翻滚效果要实现这个效果并不难，只要思路对了，一切都好办，下面有个不错的示例，大家可以参考下
2014-03-03
jQuery实现Div拖动+键盘控制综合效果的方法
这篇文章主要介绍了jQuery实现Div拖动+键盘控制综合效果的方法,实例分析了jQuery操作div块拖动的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-03-03
jquery分页插件AmSetPager(自写)
第一次做的插件，我这个插件好像使用有些另类，是调用数据展示容器的元素$(#DataContent).AmSetPager({...});在参数中配置分页容器元素ID。写完插件后看别的插件都是调用分页元素ID
2013-04-04
jQuery 操作 HTML 元素和属性的方法
这篇文章主要介绍了jQuery 操作 HTML 元素和属性的方法，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
2018-11-11
Jquery $.getJSON 在IE下的缓存问题解决方法
$.getJSON 的url都是相同的问题来了我修改或者新增树节点然后刷新tree IE竟然毫无变化在其他浏览器上面都OK，于是搜到一个可行的解决方法
2014-10-10
jQuery中after()方法用法实例
这篇文章主要介绍了jQuery中after()方法用法,以实例形式较为详细的分析了after()方法的功能、特性与使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下
2014-12-12