方法：
按下指定的方法：
$('元素').click(function(event){...});
範例語法：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>按下後改變指定樣式的方法</title>
<style type="text/css">
.cb {
border: 3px solid #CF3134;
}
.red {
border: 3px solid #9E0002;
}
.blue {
border: 3px solid #040E86;
}
.green {
border: 3px solid #0A4E00;
}
</style>
</head>
<script
src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<script language="javascript">
$(document).ready(function(){
$('#b_all').click(function(event){
if($(event.target).is('h2')){
var tk=event.target.id; ←抓取id名稱
$('p').removeClass().addClass(tk); ←依id名稱為套用樣式名稱
$('#b_all h2').removeClass('cb'); ←取消#b_all裡面的全部樣式
$(event.target).addClass('cb'); ←依id名稱套用樣式
event.stopPropagation(); ←此方法停止事件傳遞到上一層元素，避免上一層元素事件重複處理。
}
});
});
</script>
<body>
<div id="b_all">
<h2 id="red">==red==</h2>
<h2 id="blue">==blue==</h2>
<h2 id="green">==green==</h2>
</div>
<p>改變顏色abcde</p>
</body>
</html>
留言列表
程式語法 (11)
