码迷,mamicode.com
首页 > Web开发 > 详细

jQuery事件函数位置放置的两种方法

时间:2015-02-03 14:41:03      阅读:125      评论:0      收藏:0      [点我收藏+]

标签:

jQuery 事件函数

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

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。

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

实例

 1 <html>
 2 <head>
 3 <script type="text/javascript" src="jquery.js"></script>
 4 <script type="text/javascript">
 5 $(document).ready(function(){
 6   $("button").click(function(){
 7     $("p").hide();
 8   });
 9 });
10 </script>
11 </head>
12 
13 <body>
14 <h2>This is a heading</h2>
15 <p>This is a paragraph.</p>
16 <p>This is another paragraph.</p>
17 <button>Click me</button>
18 </body>
19 
20 </html>

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

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

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

$("p").hide();

单独文件中的函数

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

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

实例

1 <head>
2 <script type="text/javascript" src="jquery.js"></script>
3 <script type="text/javascript" src="my_jquery_functions.js"></script>
4 </head>

 

jQuery事件函数位置放置的两种方法

标签:

原文地址:http://www.cnblogs.com/cocos2014/p/4269671.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!