jQuery技术

jQuery学习笔记(三)_ jQuery事件

字号+ 作者:H5之家 来源:H5之家 2017-10-01 18:04 我要评论( )

jQuery事件事件方法会触发匹配元素的事件,或将函数绑定到所有匹配元素的某个事件。jQuery事件格式jQuery事件的触发方式千篇一律,可总结为以下:$(

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.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • jQuery学习笔记(四)_ 获取和设置内容或属性

    jQuery学习笔记(四)_ 获取和设置内容或属性

    2017-10-02 08:01

  • jquery easyUI form plugin bug

    jquery easyUI form plugin bug

    2017-10-01 16:00

  • jQuery学习笔记(七)_ jQuery核心总结

    jQuery学习笔记(七)_ jQuery核心总结

    2017-10-01 12:03

  • jQuery Mobile(教程一 介绍)

    jQuery Mobile(教程一 介绍)

    2017-09-20 17:18

网友点评
/