1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ?5 <title>菜鸟教程(runoob.com)</title> ?6 <script src="http://cdn.static.runoob.com/libs/jquery/2.0.0/jquery.min.js"> 7 </script> 8 <script> 9 $(document).ready(function(){10 ??$("button").click(function(){11 ????$(this).hide();12 ??});13 });14 </script>15 <script>16 ????$(document).ready(function(){17 ????????$("a").click(function(){18 ????????$(this).hide();19 ????????});20 ????});21 ????</script>22 </head>23 24 <body>25 ????<a>点我看看</a>26 <button>点我</button>27 </body>28 </html>
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ?5 <title>菜鸟教程(runoob.com)</title> ?6 <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> 7 </script> 8 <script> 9 $(document).ready(function(){10 ??$("button").click(function(){11 ????$(".test").hide();12 ??});13 });14 </script>15 </head>16 <body>17 18 <h2 class="test">这是一个标题</h2>19 <p class="test">这是一个段落。</p>20 <p>这是另外一个段落。</p>21 <button>点我</button>22 </body>23 </html>
1 !DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ?5 <title>菜鸟教程(runoob.com)</title> ?6 <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> 7 </script> 8 <script> 9 $(document).ready(function(){10 ??$("p").dblclick(function(){11 ????$(this).hide();12 ??});13 });14 </script>15 </head>16 <body>17 18 <p>双击鼠标左键的,我就消失。</p>19 <p>双击我消失!</p>20 <p>双击我也消失!</p>21 22 </body>23 </html>
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ?5 <title>菜鸟教程(runoob.com)</title> ?6 <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> 7 </script> 8 <script> 9 $(document).ready(function(){10 ??$("#p1").mouseenter(function(){11 ????alert(‘您的鼠标移到了 id="p1" 的元素上!‘);12 ??});13 });14 </script>15 </head>16 <body>17 18 <p id="p1">鼠标指针进入此处,会看到弹窗。</p>19 20 </body>21 </html>
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ?5 <title>菜鸟教程(runoob.com)</title> ?6 <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> 7 </script> 8 <script> 9 $(document).ready(function(){10 ??$("#p1").mouseleave(function(){11 ????alert("再见,您的鼠标离开了该段落。");12 ??});13 });14 </script>15 </head>16 <body>17 18 <p id="p1">这是一个段落。</p>19 20 </body>21 </html>
mousedown鼠标按下事件
<script>
$(document).ready(function(){
$("#p1").mousedown(function(){
alert("鼠标在该段落上按下");
});
});
</script>
<body>
<p id="p1">这是一个段落</p>
</body>
mouseup鼠标按下放开事件
<script>
$(document).ready(function(){
$("#p1").mouseup.(function(){
alert("鼠标在段落上松开");
})
})
</script>
<body>
<p id="p1" >这是一个段落<p>
</body>
jquery学习
原文地址:http://www.cnblogs.com/tiansan/p/7804630.html