jQuery事件-事件对象

jQuery的事件系统根据W3c的标准正常化了事件对象。这个事件对象被保证传递给事件执行者。大多数属性被从原始事件中复制并正常化到新的事件对象上。


jQuery.Event构造器

jQuery.Event构造器是开放的(exposed),当调用trigger时,就可以使用的。new操作符是可选的。
可以查看trigger的文档,如何将它和你的事件对象结合起来。
如:
//Create a new jQuery.Event object without the "new" operator.
var e = jQuery.Event("click");
// trigger an artificial click event
jQuery("body").trigger( e );
jQuery1.6中你可以传递一个对象给jQuery.Event(),并且它的属性会被在新创建的事件对象上创建。
如:

// Create a new jQuery.Event object with specified event properties.
var e = jQuery.Event("keydown", { keyCode: 64 });
// trigger an artificial keydown event with keyCode 64
jQuery("body").trigger( e );

事件属性
jQuery为跨平台的一致性正常化了下面的属性:targetrelated Target pageX pageY which metaKey.

如下的属性也会被复制到事件对象上,即使他们的一些值会是undefined而取决于该事件:
altKey, bubbles, button, cancelable, charCode, clientX, clientY, ctrlKey, currentTarget, data, detail, eventPhase, metaKey, offsetX, offsetY, originalTarget, pageX, pageY, prevValue, relatedTarget, screenX, screenY, shiftKey, target, view, which

其他属性

一些事件也许会有特定的属性。这些可以通过event.originalEvent对象将其作为属性来访问。
如让特殊的属性能够适合所有的事件对象,他们能被添加到jQuery.event.props的数组中。这是不推荐的,因为它为每一个事件增加了开销。
如:

  // add the dataTransfer property for use with the native `drop` event
  // to capture information about files dropped into the browser window
  jQuery.event.props.push("dataTransfer");



event.currentTarget

事件发生的当前元素
这个属性典型的和函数的this相同
如果你在使用jQuery.proxy或者其他的范围的操作,this和你提供的任何上下文(context)都相同,event.currentTarget却不是。

$("p").click(function(event) {
  alert( event.currentTarget === this ); // true
});

event.data

当当前执行的处理者被绑定,可选的对象data可传递给事件方法

event.delegateTarget

当前被调用的jQuery事件句柄被附加的地方

event.isDefaultPrevented()

返回判断event.preventDefault()是否在该事件对象上被调用

event.isImmediatePropagationStopped()

返回判断event.stopImmediatePropagation()是否在该事件对象上被调用

event.isPropagationStopped()

返回判断event.stopPropagation()是否在该事件对象上被调用

event.metaKey
指示判断META键是否被按下

event.namespace

当事件被触发时指定的namespace

event.pageX
光标相对文档的左边缘的位置

event.pageY
光标相对文档的上边缘的位置

event.preventDefault()

该方法是够被调用,事件默认的动作不会被触发

event.relatedTarget

在事件中涉及的其他DOM元素,如果有的话

event.result

被该事件触发的由事件句柄返回的最后的值,除非该值为undefined

event.stopImmediatePropagation()

将其他的处理程序不被执行,阻止事件产生DOM树的冒泡

event.stopPropagation()

阻止事件产生DOM树的冒泡,并且阻止任何父句柄被该事件通知

event.target

初始化该事件的DOM元素

event.timeStamp

返回浏览器创建该事件的时间和1970-01-01的差值的毫秒形式

event.type

描述事件的类型

event.which

对于按键和鼠标事件,这个属性会指明被点击的具体的按键或者button

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
对不起,我无法提供淘宝精品服饰案例的 jQuery 代码。但是,我可以为您提供一些关于如何使用 jQuery 开发淘宝精品服饰案例的一般指导。 首先,您需要引入 jQuery 库。您可以在 HTML 文件中使用以下代码来引入 jQuery: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> ``` 接下来,您可以使用 jQuery 来处理页面中的元素,例如添加、删除、修改元素的内容和样式等。下面是一个简单的例子,展示了如何使用 jQuery 选择元素,并为其添加点击事件: ```html <!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <h1>淘宝精品服饰案例</h1> <div id="item1">精品T恤</div> <div id="item2">精品裤子</div> <script> $(document).ready(function() { // 选择元素并添加点击事件 $("#item1").click(function() { alert("您点击了精品T恤!"); }); $("#item2").click(function() { alert("您点击了精品裤子!"); }); }); </script> </body> </html> ``` 在上面的例子中,我们使用 `$` 符号来表示 jQuery 对象,然后通过选择器选择元素(使用 `#` 表示选择 ID),并使用 `click` 方法为选定的元素添加点击事件。当用户点击相应的元素时,就会弹出一个提示框。 以上只是一个简单的示例,实际开发中您可以根据需求使用更多的 jQuery 方法和功能来构建淘宝精品服饰案例。希望对您有所帮助!如果您有更多问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值