jQuery学习笔记（三）_ jQuery事件

来源：互联网发布：婚纱店装修效果图软件编辑：程序博客网时间：2024/06/06 01:18

jQuery事件

事件方法会触发匹配元素的事件，或将函数绑定到所有匹配元素的某个事件。

jQuery事件格式

jQuery事件的触发方式千篇一律，可总结为以下：

$("选择器").要触发的事件名称(function(){    $("某元素").对当前元素实现效果所用的方法();  //触发的事件所要表现的效果    ...     ...});

完整示例代码：（示例代码为在单击按钮时段落“hello jQuery！”隐藏，再次点击，则显示；）

<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $("button").mousedown(function(){    $("p").slideToggle();  });});</script></head><body><p>hello jQuery！</p><button>切换</button></body></html>

常用的事件方法

1.ready() 方法

当 DOM（文档对象模型）已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。
由于该事件在文档就绪后发生，因此常常把把所有其他的 jQuery 事件和函数置于该事件中。

2.focus() 方法和 blur() 方法

前者为当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。
后者为当元素失去焦点时发生 blur 事件。

3.click()方法和dblclick()方法

当点击元素时，会发生 click 事件。
当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就会发生一次 click；
当双击元素时，会发生 dblclick 事件。

4.mouseenter()方法和mouseleave()方法

前者为当鼠标指针穿过元素时，会发生 mouseenter 事件。
后者为当鼠标指针离开元素时，会发生 mouseleave 事件。

5.mouseover()方法和mouseout()方法

当鼠标指针位于元素上方时，发生 mouseover 事件。
当鼠标指针从元素上移开时，发生 mouseout 事件。

注：与 mouseenter 事件不同，不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。

6.submit() 方法

当提交表单时，会发生 submit 事件。
该事件只适用于表单元素。

阅读全文

1 0