標籤：選中 utf-8 blog span oat 舉例 seo phpstudy htm
jquery事件相對於js來說要簡單一些，尤其是代碼的數量明顯更簡略，下面是jquery事件的兩個例子，一個是全選事件，一個是導覽列的滑鼠移上移除事件：
一、全選事件：
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script src="../../../phpstudy/WWW/jquery-3.2.0.min.js"></script><title>無標題文檔</title></head><body><h1>全選效果</h1><div><input type="checkbox" value="qx" id="qx" /> 全選</div><br /><div><input type="checkbox" value="1" class="ck" /> 路飛<input type="checkbox" value="1" class="ck" /> 索隆<input type="checkbox" value="1" class="ck" /> 山治<input type="checkbox" value="1" class="ck" /> 娜美<input type="checkbox" value="1" class="ck" /> 烏索普<input type="checkbox" value="1" class="ck" /> 弗蘭奇</div></body><script type="text/javascript">$("#qx").click(function(){ //找到全選按鈕的選中狀態 //var xz = $(this)[0].checked; var xz = $(this).prop("checked"); //改變所有的checkbox選中狀態 $(".ck").prop("checked",xz); })</script></html>
二、導覽列的滑鼠移上移除事件
<style>.a{ width:50px; height:20px; float:left; margin:10px; }</style><script src="jquery-3.2.0.min.js"></script></head><body><div class="a">首頁</div><div class="a">史記</div><div class="a">漢書</div><div class="a">後漢書</div><div class="a">三國志</div></body><script>$(".a").mouseover(function(){ $(this).css("background-color","#666")//點擊後變為灰色})$(".a").mouseout(function(){ $(this).css("background-color","#FFF")//移除後變為白色}) </script></html>
jquery簡單事件舉例
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
