首页 > 语言 > JavaScript > 正文

Jquery注册事件实现方法

2024-05-06 16:20:33
字体:
来源:转载
供稿:网友

这篇文章主要介绍了Jquery注册事件实现方法,以实例形式分析了jQuery实现按钮注册鼠标事件的相关技巧,非常简单实用,需要的朋友可以参考下

本文实例讲述了Jquery注册事件实现方法。分享给大家供大家参考。具体如下:

 

 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
  3. <html xmlns="http://www.w3.org/1999/xhtml"
  4. <head> 
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  6. <title>事件绑定</title> 
  7. <script src="jquery-1.6.2.min.js" type="text/javascript"></script> 
  8. <script type="text/javascript"
  9. var oldColor; 
  10. $(function () { 
  11. //注册ID为btnTest的按钮的click事件 
  12. $("#btnTest").click(function () { 
  13. var $divs = $("div"); 
  14. $divs.html("我是修改后的Div文本"); 
  15. }); 
  16. //注册ID为btnTest的按钮的mouseover事件,鼠标经过时添加背景色 
  17. $("#btnTest").mouseover(function () { 
  18. oldColor = $("#btnTest").css("background-color"); 
  19. $("#btnTest").css("background-color""green"); 
  20. }); 
  21. //注册ID为btnTest的按钮的mouseout事件,鼠标离开时还原背景色 
  22. $("#btnTest").mouseout(function () { 
  23. $("#btnTest").css("background-color", oldColor); 
  24. }); 
  25. }); 
  26. </script> 
  27. </head> 
  28. <body> 
  29. <div id="main"
  30. <div id="div1" class="myDiv">我是div1 
  31. <div id="divSun">我是孙子div 
  32. <div id="divSunSun">我是孙子的孙子div</div> 
  33. </div> 
  34. <div id="divSun1">我是孙子div</div> 
  35. </div> 
  36. <div id="div2" class="myDiv">我是div2</div> 
  37. </div> 
  38. <div id="main1"></div> 
  39. <div id="main2"></div> 
  40. <input id="btnTest" type="button" value="测试按钮" /> 
  41. <div id="main3"></div>  
  42. </body> 
  43. </html> 

希望本文所述对大家的jQuery程序设计有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选