[ jQuery ] 按下後改變樣式的方法

方法：
按下方法有兩種：

1. $('元素').click(function(){ ......});

2. $('元素').bind('click',function(){ ......});

樣式新增刪除：

新增：$('#b1').addClass('cb');

刪除：$('#b2').removeClass('cb');

新增或刪除：$('#b3').toggleClass('cb');

程式範例：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>按下後改變樣式的方法</title>
<style type="text/css">
.cb {
   border: 3px solid #CF3134;
}
</style>
</head>
<script
src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<script language="javascript">
   $(document).ready(function(){
   $('#b1').click(function(){
       $('#b1').addClass('cb');
   });
   $('#b2').bind('click',function(){
       $('#b2').removeClass('cb');
   });
   $('#b3').bind('click',function(){
       $('#b3').toggleClass('cb');
   });
   });
</script>
<body>
<h1 id="b1">新增紅框樣式</h1>
<h1 id="b2" class="cb">刪除紅框樣式</h1>
<h1 id="b3">新增或刪除紅框樣式</h1>
</body>
</html>

小甲學習地

學習資訊部落

小甲學習地發表在痞客邦留言(0) 人氣( 87 )

全站分類：進修深造
個人分類： jQuery

▲top

請先登入以發表留言。

新增紅框樣式

刪除紅框樣式

新增或刪除紅框樣式

學習資訊部落

歡迎光臨，來到學習天地。本部落以學習為主。

參觀人氣

新增紅框樣式

刪除紅框樣式

新增或刪除紅框樣式

學習資訊部落

歡迎光臨，來到學習天地。 本部落以學習為主。