A.单击事件：
示例代码1：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample4</title> <script type="text/javascript" src="./jquery-1.5.min.js"></script> <script type="text/javascript"> $(function(){ $("a").click(function(){ $("img").attr("src","sea.jpg").attr("alt","海"); return false; }); }); </script> </head> <body> <a href="sea.jpg">画像を変更</a> <p><img src="flower.jpg" alt="花" /></p> </body> </html>
使用jQuery追加<a>元素的click事件后，浏览器会自动打开<a>元素的href属性指定的url。
为了回避这个问题，通常使用下面的2个方法。
1.如示例代码中一样，在处理的后面追加return false;
2.把<a>元素的href属性设置成javascript:void(0);
B.双击事件：
示例代码2：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample8</title> <script type="text/javascript" src="./jquery-1.5.min.js"></script> <script type="text/javascript"> $(function(){ $("a").dblclick(function(){ $("img").attr("src",$(this).attr("href")).attr("alt",$(this).text()); }).click(function(){ return false; }); }); </script> </head> <body> <ul> <li><a href="flower.jpg">花</a></li> <li><a href="sea.jpg">海</a></li> <li><a href="Jellyfish.jpg">くらげ</a></li> <li><a href="Building.jpg">建物</a></li> </ul> <p><img src="flower.jpg" alt="花" /></p> </body> </html>
即便在双击事件中追加了return false；也会出现不正常工作的现象，解决的办法是在每次click单击事件中都追加return false；处理。
