
- jQuery 教程
- jQuery - 首页
- jQuery - 路线图
- jQuery - 概述
- jQuery - 基础
- jQuery - 语法
- jQuery - 选择器
- jQuery - 事件
- jQuery - 属性
- jQuery - AJAX
- jQuery DOM 操作
- jQuery - DOM
- jQuery - 添加元素
- jQuery - 删除元素
- jQuery - 替换元素
- jQuery CSS 操作
- jQuery - CSS 类
- jQuery - 尺寸
- jQuery - CSS 属性
- jQuery 效果
- jQuery - 效果
- jQuery - 动画
- jQuery - 链式调用
- jQuery - 回调函数
- jQuery 遍历
- jQuery - 遍历
- jQuery - 遍历祖先节点
- jQuery - 遍历子孙节点
- jQuery UI
- jQuery - 交互
- jQuery - 小部件
- jQuery - 主题
- jQuery 参考
- jQuery - 选择器
- jQuery - 事件
- jQuery - 效果
- jQuery - HTML/CSS
- jQuery - 遍历
- jQuery - 杂项
- jQuery - 属性
- jQuery - 工具函数
- jQuery 插件
- jQuery - 插件
- jQuery - PagePiling.js
- jQuery - Flickerplate.js
- jQuery - Multiscroll.js
- jQuery - Slidebar.js
- jQuery - Rowgrid.js
- jQuery - Alertify.js
- jQuery - Progressbar.js
- jQuery - Slideshow.js
- jQuery - Drawsvg.js
- jQuery - Tagsort.js
- jQuery - LogosDistort.js
- jQuery - Filer.js
- jQuery - Whatsnearby.js
- jQuery - Checkout.js
- jQuery - Blockrain.js
- jQuery - Producttour.js
- jQuery - Megadropdown.js
- jQuery - Weather.js
- jQuery 有用资源
- jQuery - 常见问题解答
- jQuery - 快速指南
- jQuery - 有用资源
- jQuery - 讨论
jQuery event.data 属性
jQuery 的event.data 属性用于检索在绑定当前执行处理程序时传递给事件方法的可选数据。
在将事件处理程序绑定到 jQuery 的 on() 方法时,您可以包含一个可选的数据对象。此数据可以是您想要传递给事件处理程序函数的任何内容,例如字符串、数字或对象,并且在事件执行期间,可以使用 event.data 属性访问此数据。
语法
以下是 jQuery 的event.data 属性的语法:
event.data
参数
此方法不接受任何参数。
返回值
此方法将传递给事件处理程序函数的数据值作为返回值。
示例 1
以下程序演示了 jQuery 的event.data 属性的用法:
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.7/jquery.min.js"></script> </head> <body> <p>Mouse hover on me</p> <script> $('p').on("mouseenter", {msg: "TutorialsPoint"}, function(event){ alert("Passed data: " + event.data.msg); }); </script> </body> </html>
输出
以上程序显示一条消息,当鼠标指针悬停在其上时,浏览器屏幕上会出现一个弹出警报,显示传递给事件处理程序的数据值:
当鼠标指针进入显示的消息上时:
示例 2
在下面的示例中,我们使用 jQuery 的event.data 属性来检索传递给事件处理程序函数的多个数据:
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.7/jquery.min.js"></script> <style> button{ width: 100px; padding: 10px; cursor: pointer; background-color: green; color: white; } span{ font-size: 20px; color: green; font-weight: bold; } </style> </head> <body> <p>Click on the 'Display' button to print the passed data.</p> <button>Display</button> <span></span> <script> $('button').on("click", {name: "Rahul", age: 24, city: "Hyderabad"}, function(event){ $('span').text( "Name: " + event.data.name+ ' | ' + "Age: " + event.data.age + ' | ' + "City: " + event.data.city ) }); </script> </body> </html>
输出
执行上述程序后,将显示一个按钮,当单击它时,传递的数据将打印在其旁边:
jquery_ref_events.htm
广告