javascript 小範例 點選btn2 改變class 點選btn1、btn3恢復class

  • 192
  • 0
  • 2017-09-21

script

<!DOCTYPE html>
 <html>
 <head>
 <style>
 .btn_02 {
 color:#000000;
}
 .btn_02a {
 color:#ff0000;
}

 </style>
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     <title></title>
  <meta charset="utf-8" />
     <script type="text/javascript">
         function myFunction(btn) {
             if (btn == 'btn2') {
                 document.getElementById("btn_02").className = "btn_02a";
             }
             else
             {
                 document.getElementById("btn_02").className = "btn_02";
             }
         }
     </script>
 </head>
 <body>
     <input name="btn_01" id="btn_01" type="submit" value="btn1" onclick="myFunction('btn1')">
     <input name="btn_02" id="btn_02" type="submit" value="btn2" class="btn_02"  onclick="myFunction('btn2')">
     <input name="btn_03" id="btn_03" type="submit" value="btn3" onclick="myFunction('btn3')">
 </body>
 </html>