jQuery 怎么处理事件? 下面本篇文章给大家简单介绍一下. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
使用 jQuery 事件函数, jQuery 事件处理方法来处理事件.
jQuery 事件函数, jQuery 事件处理方法是 jQuery 中的核心函数.
事件处理程序指的是当 html 中发生某些事件时所调用的方法. 术语由事件 "触发"(或 "激发") 经常会被使用.
jQuery 事件
下面是 jQuery 中事件方法的一些例子:
Event 函数 < br ztid="65" ow="0" oh="0"> | 绑定函数至 < br ztid="68" ow="0" oh="0"> |
$(document).ready(function) | 将函数绑定到文档的就绪事件(当文档完成加载时) |
$(selector).click(function) | 触发或将函数绑定到被选元素的点击事件 < br ztid="78" ow="0" oh="0"> |
$(selector).dblclick(function) | 触发或将函数绑定到被选元素的双击事件 < br ztid="83" ow="0" oh="0"> |
$(selector).focus(function) | 触发或将函数绑定到被选元素的获得焦点事件 < br ztid="88" ow="0" oh="0"> |
$(selector).mouseover(function) | 触发或将函数绑定到被选元素的鼠标悬停事件 < br ztid="93" ow="0" oh="0"> |
实例:
当你对按钮 Click me 进行点击操作时,<p > 标签中的内容会隐藏.
- <HTML>
- <head>
- <script type="text/javascript" src="/jquery/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 type="button">Click me</button>
- </body>
- </HTML>
结论
由于 jQuery 是为处理 HTML 事件而特别设计的, 那么当您遵循以下原则时, 您的代码会更恰当且更易维护:
把所有 jQuery 代码置于事件处理函数中
把所有事件处理函数置于文档就绪事件处理器中
把 jQuery 代码置于单独的 .JS 文件中
如果存在名称冲突, 则重命名 jQuery 库
更多 web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/16995.html