如何在单击时更改颜色，以选择一个按钮进行加载

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#order').trigger('click') 触发器。您希望它在页面加载时触发，而不是在单击另一个 h3 时触发。将它保存在文档就绪函数中将导致它在页面加载时触发。你的选择器也是错误的。 H3 的 ID 为 'orderr'。你真的不应该给所有东西都提供如此相似的 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>

如何在单击时更改颜色，以选择一个按钮进行加载

How to make a colour change on click, to load with one button selected

html

javascript

jquery

onclick

buttonclick