jQuery事件函数位置放置的两种方法
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>
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。