继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

jQuery 事件

喵喵一只汪
关注TA
已关注
手记 315
粉丝 87
获赞 467

jQuery 是为事件处理特别设计的。

jQuery 事件函数

jQuery 事件处理方法是 jQuery 中的核心函数。

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”(或“激发”)经常会被使用。

通常会把 jQuery 代码放到 <head>部分的事件处理方法中:

实例

<html><head><script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $("button").click(function(){     $("p").hide();   });});</script></head><body><h2>This is a heading</h2><p>This is a paragraph.</p><p>This is another paragraph.</p><button>Click me</button></body></html>

 购物导航  http://www.ganshuw.com

购物分享 http://www.jielala.com/

在上面的例子中,当按钮的点击事件被触发时会调用一个函数:

$("button").click(function() {..some code... } )

该方法隐藏所有 <p> 元素:

$("p").hide();

单独文件中的函数

如果您的网站包含许多页面,并且您希望您的 jQuery 函数易于维护,那么请把您的 jQuery 函数放到独立的 .js 文件中。

当我们在教程中演示 jQuery 时,会将函数直接添加到 <head> 部分中。不过,把它们放到一个单独的文件中会更好,就像这样(通过 src 属性来引用文件):

实例

<head><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="my_jquery_functions.js"></script></head>

jQuery 名称冲突

jQuery 使用 $ 符号作为 jQuery 的简介方式。

某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号。

jQuery 使用名为 noConflict() 的方法来解决该问题。

var jq=jQuery.noConflict(),帮助您使用自己的名称(比如 jq)来代替 $ 符号。

 强烈支持楼主

http://www.qvodw.biz

http://www.kankanw.biz/

结论

由于 jQuery 是为处理 HTML 事件而特别设计的,那么当您遵循以下原则时,您的代码会更恰当且更易维护:

  • 把所有 jQuery 代码置于事件处理函数中

  • 把所有事件处理函数置于文档就绪事件处理器中

  • 把 jQuery 代码置于单独的 .js 文件中

  • 如果存在名称冲突,则重命名 jQuery 库

jQuery 事件

下面是 jQuery 中事件方法的一些例子:

Event 函数绑定函数至
$(document).ready(function)将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function)触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function)触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)触发或将函数绑定到被选元素的鼠标悬停事件

 

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP