如何在點擊時改變顏色，選擇一個按鈕進行加載

Question

點擊顏色變化，當另一個按鈕被按下時顏色改變，然後恢復正常。但我想知道如何在頁面加載時突出顯示一個按鈕，然後在按下另一個按鈕時變爲未加亮顯示，然後返回到正常設置。

我的腳本可以工作，但只是在頁面加載時不會突出顯示我的一個切換。我希望我的帳戶按鈕在頁面加載時突出顯示。我已經嘗試過，但一直不走運。請幫忙！

<script> 
 
     $(document).ready(function() { 
 
      $('.sidebar h3').on('click', function() { 
 
       $('.sidebar h3').css('color', 'black'); 
 
       $(this).css('color', 'red'); 
 
        $('h3#order').trigger('click'); 
 
      
 
      }); 
 
     }); 
 
    </script>

<div class="sidebar"> 
 
    <a id="order" class="header" href="#" onclick="toggleVisibility('Order');"><h3 id="orderr">Orders</h3></a> 
 
      <div id="Order" style="display: none;"></div>  
 
       
 
<a id="restt" class ="header"href="#" onclick="toggleVisibility('Rest');"><h3>Your Restaurants</h3></a> 
 
      <div id="Rest" style="display: none;"><div> 
 
<!-- account -->    
 
<a id="francc" name="account" class ="header" href="#" onclick="toggleVisibility('Franc');"><h3 id="open">Your Account</h3></a> 
 
      <div id="Franc" style="display: none;"></div> 
 
      

Answer 1

首先把你的$（ '＃H3令'）。觸發器（ '點擊'），觸發了你的點擊處理程序。你希望這在觸發頁面加載而不是另一個h3的點擊。將其保留在文檔就緒功能中會導致它在頁面加載時觸發。你的選擇器也是錯的。 H3有一個'訂單'的ID。你真的不應該給這些類似ID的東西，也不需要所有的東西都有ID。

<script> 
     $(document).ready(function() { 
      $('.sidebar h3').on('click', function() { 
       $('.sidebar h3').css('color', 'black'); 
       $(this).css('color', 'red'); 
      }); 

      $('h3#orderr').trigger('click'); 
     }); 
    </script>