JQuery 自己主动触发事件
经常使用模拟
有时候,须要通过模拟用户操作,来达到单击的效果。比如在用户进入页面后,就触发click事件,而不须要用户去主动单击。
在JQuery中。能够使用trigger()方法完毕模拟操作。比如能够使用以下的代码来触发id为btn的button的click事件。
1 |
$('#btn').trigger("click"); |
这样,当页面载入完成后。就会立马输出想要的效果。也能够直接简写click()。来达到相同的效果:
1 |
$('#btn').click(); |
触发自己定义事件
trigger()方法不仅能触发浏览器支持的具有同样名称的事件。也能够触发自己定义名称的事件。比如为元素绑定一个“myClick”的事件。JQuery代码例如以下:
1 |
$('#btn').bind("myClick",function(){ |
2 |
$('#test').append("<p>我的自己定义事件.</p>"); |
3 |
}); |
想要触发这个事件,能够使用下面代码来实现:
1 |
$('#btn').trigger("myClick"); |
传递数据
trigger(type[,data])方法有两个參数。第1个參数是要触发的事件类型,第2个參数是要传递给事件处理函数的附加数据,以数组形式传递。
通常能够通过传递一个參数给回调函数来差别这次事件是代码触发的还是用户触发的。
以下是一个传递数据的样例。
1 |
$(function(){ |
2 |
$('#btn').bind("myClick",function(event, message1, message2){ |
3 |
$('#test').append("<p>"+message1 + message2 +"</p>"); |
4 |
});
|
5 |
$('#btn').click(function(){ |
6 |
$(this).trigger("myClick",["我的自己定义","事件"]); |
7 |
}).trigger("myClick",["我的自己定义","事件"]); |
8 |
}) |
运行默认操作
trigger()方法触发事件后,会运行浏览器默认操作。比如:
1 |
$("input").trigger("focus"); |
以上代码不仅会触发为<input>元素绑定的focus事件,也会使<input>元素本身得到焦点(这是浏览器的默认操作)。
假设仅仅想触发绑定的focus事件,而不想运行浏览器默认操作,能够使用jQuery中还有一个类似的方法——triggerHandler()方法。
1 |
$("input").triggerHandler("focus"); |
该方法会触发<input>元素上绑定的特定事件,同一时候取消浏览器对此事件的默认操作。即文本框仅仅触发绑定的focus事件,不会得到焦点。
JQuery 自己主动触发事件的更多相关文章
- 主动触发事件 自定义事件 trigger 及其用法
1. 触发自定义事件方式 js.jq 2. jq 触发 2.1 默认支持的事件 $('#h').on('click',function(){ $(this).append('<p>p< ...
- js和jquery中的触发事件
改别人的坑,遇到jquery选择器和fireEvent混用,不认识fireEvent方法报错. js的方法不能使用jquery的选择器去调用. 1.fireEvent (IE上的js方法 ) 我们来看 ...
- js jq 主动触发事件
js的自定义事件与触发 //主动触发事件:触发鼠标被按下事件 var btn2 =document.getElementById("btn2"); var btn = docume ...
- jquery的实时触发事件(textarea实时获取中文个数)
jquery的实时触发事件(textarea实时获取中文个数) (2014-09-16 11:49:50) 转载▼ 标签: 实时触发事件 中文个数 onpropertychange oninput o ...
- jQuery-1.9.1源码分析系列(十) 事件系统——主动触发事件和模拟冒泡处理
发现一个小点,先前没有注意的 stopPropagation: function() { var e = this.originalEvent; ... if ( e.stopPropagation ...
- 选项卡切换:自动定时&主动触发事件
最初学习的是手动触发事件,添加的是onmouseover,其中index是关键,tab标签与现实内容的div索引一一对应,遍历tab标签,当鼠标移动到某标签时,触发对应的内容div显示.for(var ...
- jquery实现回车键触发事件
键盘事件有3: keydown,keypress,keyup,分别是按下,按着没上抬,上抬键盘 . 正确代码为: $(document).keyup(function(event){ if(event ...
- js简单自定义事件与主动触发事件
var events = { addHandler: function (element, eventType, handler) { if (element.addEventListener) { ...
- 原生js自动触发事件
熟悉jquery的童鞋都知道在jq中有一个方法可以自动触发事件,那就是trigger(),那么通过原生js又怎么模拟触发呢? js中添加一个主动触发事件的方法有dispatch.该方法能模拟用户行为, ...
随机推荐
- 第七章之main函数和启动例程
main函数和启动例程 为什么汇编程序的入口是_start,而C程序的入口是main函数呢?本节就来解释这个问题.在讲例 18.1 “最简单的汇编程序”时,我们的汇编和链接步骤是: $ as hell ...
- http协议基础(七)通用首部字段
通用首部字段的意思,就是:请求和响应报文双方都会使用的首部 1.Cache-Control 通过指定它的指令,能操作缓存的工作机制 指令参数是可选的,多个指令通过“,”分隔 Cache-Control ...
- zw版【转发·台湾nvp系列Delphi例程】HALCON SigmaImage2
zw版[转发·台湾nvp系列Delphi例程]HALCON SigmaImage2 procedure TForm1.Button1Click(Sender: TObject);var op: HOp ...
- Azkaban学习笔记(二)
官方文档:http://azkaban.github.io/ 一.Azkaban主要的组成: 1. 关系型数据库——MySQL 2. AzkabanWebServer 3. AzkabanExcuto ...
- linux常用命令:killall 命令
killall命令用进程的名字来杀死进程. 1.命令格式: killall [ -egiqvw ] [ -signal ] [进程名称] 格式:killall -<signame> ...
- python之路----面向对象的封装特性
封装 [封装] 隐藏对象的属性和实现细节,仅对外提供公共访问方式. 广义上面向对象的封装 :代码的保护,面向对象的思想本身就是一种只让自己的对象能调用自己类中的方法 狭义上的封装 —— 面向对象的三大 ...
- Nginx 灰度实现方式(支持纯灰度,纯生产,50度灰及更多比例配置)
前言 Nginx相关技术短信本篇幅不做详细介绍,所以学习本文之前要对Nginx有相关的了解. 生产环境即线上环境,在经历开发.测试再到上线,不可避免的会更新生产环境,但谁又能保证测试过的代码到线上运行 ...
- [noip模拟题]合理种植
[问题描述] 大COS在氯铯石料场干了半年,受尽了劳苦,终于决定辞职.他来到表弟小cos的寒树中学,找到方克顺校长,希望寻个活干. 于是他如愿以偿接到了一个任务…… 美丽寒树中学种有许多寒树.方克顺希 ...
- Duilib初级控件扩展一例: 具有鼠标滚动消息的OptionUI
转载:http://www.cnblogs.com/memset/p/Duilib_MouseWheelOptionUI_Deprecated.html
- VC++禁止标题栏鼠标双击事件
转载:http://blog.sina.com.cn/s/blog_4ad042e50102dwv0.html 重载DefWindowProc,在里面截获WM_NCLBUTTONDBLCLK消息进行处 ...