`
lucifinilhades
  • 浏览: 86017 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

jQuery 事件模型【2】

阅读更多

影响事件传播

除了将Event实例最常用的属性标准化以外,jQuery还提供标准方法用于影响事件传播方面,带来同样的好处。

stopPropagation()方法将防止事件沿着DOM树向上传播,而preventDefault()方法将取消可能引起任何语义操作的示例是,a元素的href链接加载、表单提交以及click事件引起复选框的状态切换。

如果想在停止事件传播的同时,取消事件的默认行为,可以返回false作为监听器函数的返回值。

除允许以独立于浏览器的方式建立事件处理以外,jQuery还提供一组命令,赋予我们在脚本控制下触发事件处理程序的能力。

触发事件处理程序

在相关事件触发通过DOM层次结构的事件传播时,事件处理程序被设计为被调用。但有时候我们想在脚本控制下触发处理程序的执行。可以把事件处理程序定义为顶层函数,以便通过名称调用它们。但是把事件处理程序定义为匿名的内联函数更为常见,并且非常方便。

jQuery定义在脚本控制下自动触发事件处理函数的一系列方法,从而帮助我们避免使用顶层函数。

 

语法:trigger(eventType)

功能:调用所有已匹配元素的为已传递事件类型而建立的任何事件处理程序。

参数 eventType:(字符串)指定将要调用的处理程序的事件类型名称。

返回:包装集。

注意:trigger()命令不会导致事件触发和通过DOM层次结构进行传播。

 

语法:eventName()

功能:调用为所有已匹配元素的指名事件类型而建立的任何事件处理程序。已支持的命令包括:blur()、click()、focus()、select()、submit()。

返回:包装集。

其他事件相关命令

语法:toggle(listenerOdd, listenerEven)

功能:把已传递函数建立为包装集所有元素的一对click事件处理程序,每当触发click事件就相互切换。

参数 listenerOdd:(函数)充当所有奇数次点击的click事件处理程序。

参数 listenerEven:(函数)充当所有偶数次点击的click事件处理程序。

返回:包装集。

 

该命令的觉用途是根据元素被点击的次数切换元素的启用状态。

 

语法:hover(overListener, outListener)

功能:建立已匹配元素的mouseover和mouseout事件处理程序。这些处理程序当且仅当元素所覆盖区域被进入和退出时触发,忽略鼠标指针从父元素到子元素上的迁移。

参数 overListener:(函数)作为mouseover事件处理程序的函数。

参数 outListener:(函数)作为mouseout事件处理程序的函数。

返回:包装集。

分享到:
评论

相关推荐

    jQuery学习5 jQuery事件模型

    2. **多事件处理器**:jQuery允许在单个元素上为同一种事件类型绑定多个处理程序。例如,你可以为一个按钮同时绑定多个点击事件处理程序,每个处理程序执行不同的功能。 3. **标准事件类型**:jQuery遵循W3C的DOM...

    jquery模型驱动插件

    2. **事件监听**:插件还监听页面上与模型相关的元素,如表单提交、按钮点击等,当用户交互触发数据改变时,插件会自动调用 AJAX 发送更新至服务器,保持服务器端与客户端数据的一致性。 3. **双向数据绑定**:模型...

    JQuery事件Demo

    jQuery库大大简化了这一过程,提供了丰富的API和方法来处理DOM(文档对象模型)中的事件。本篇文章将深入探讨jQuery事件处理及其相关示例,帮助你更好地理解和运用jQuery在实际项目中的功能。 ### 一、jQuery事件...

    jquery基本模型.xmind

    jquery多脑图总结大全

    为jQuery添加自定义事件机制

    首先,我们要了解jQuery的事件系统是基于浏览器的事件模型构建的。默认情况下,jQuery提供了如click、mouseover等内置事件,但有时我们需要自定义一些特定业务场景的事件。例如,当用户完成一项复杂操作或者数据加载...

    jQuery事件函数共4页.pdf.zip

    jQuery简化了DOM(文档对象模型)事件处理,使得在网页交互中添加、移除和触发事件变得更加简单。这份4页的PDF文档可能包含了丰富的实践示例和代码片段,旨在帮助开发者更深入地理解并熟练运用jQuery事件。 jQuery...

    基于Flask+jQuery前后端分离部署pytorch模型案例源码.zip

    基于Flask+jQuery前后端分离部署pytorch模型案例源码.zip基于Flask+jQuery前后端分离部署pytorch模型案例源码.zip基于Flask+jQuery前后端分离部署pytorch模型案例源码.zip基于Flask+jQuery前后端分离部署pytorch模型...

    jQuery-UI和jsPlumb实现拖拽连接模型demo下载

    在实现拖拽连接模型的过程中,我们需要监听jQuery-UI的`stop`事件,当拖放操作结束时,根据当前元素的位置和jsPlumb的端点规则创建新的连接。同时,jsPlumb的连接事件也可以用来更新拖放后的连接状态。通过结合两者...

    jQuery Mobile事件参考手册.zip_jQuery Mobile事件参考手册

    2. 用户交互事件: - `tap`:模拟原生点击事件,当手指触摸屏幕并在短时间内抬起时触发,适合处理触摸设备上的点击操作。 - `taphold`:当用户长时间按住屏幕时触发,常用于实现右键点击或长按菜单的功能。 - `...

    jQuery实现当按下回车键时绑定点击事件

    本文将详细探讨如何使用jQuery实现当用户按下回车键时光标所在输入框外的其他地方触发一个按钮的点击事件。 首先,需要了解的是,当一个网页被加载时,它在浏览器中生成了一个文档对象模型(DOM),我们可以通过...

    jQuery事件模型默认行为执行顺序及trigger()与 triggerHandler()比较实例分析

    在jQuery中,事件模型是基于DOM级别的事件处理和模拟事件触发的一个重要部分。理解其默认行为执行顺序以及`trigger()`和`triggerHandler()`的区别对于优化和控制JavaScript代码的行为至关重要。 通常,浏览器在处理...

    jQuery键盘按键按钮响应事件代码

    在jQuery中,`$(document).ready()` 是一个常见的方法,用于确保DOM(文档对象模型)完全加载后才执行脚本。在这个阶段,我们可以绑定事件监听器到元素上,例如: ```javascript $(document).ready(function() { /...

    深入理解jQuery 事件处理

    浏览器的事件模型 DOM第0级事件模型 1.Event实例 他的属性提供了关于当前正被处理的已触发事件的大量信息。这包括一些细节,比如在哪个元素上触发的事件、鼠标事件的坐标以及键盘事件中单击...jQuery事件模型 使用jQue

Global site tag (gtag.js) - Google Analytics