链接到单独页面上的div并在点击链接时突出​​显示div

Question

我正在尝试在侧面导航中突出显示特定的div onclick链接。到目前为止它可以工作（当在默认页面上时）但是当你转到另一个页面然后单击侧面导航中的项目时，它将锚定到指定的div，但不会突出显示。我需要重新链接该链接才能突出显示。

var App = {
    SetBaseLine: function() {
    jQuery("#priceRange, #satisfaction").removeClass("activeListColor");
    }
};

jQuery(document).ready(function() {
    jQuery('a#priceLink').click(function(e) {
        App.SetBaseLine();
        jQuery('#priceRange').addClass('activeListColor');
    });
    jQuery('a#satisfactionLink').click(function(e) {
        App.SetBaseLine();
        jQuery('#satisfaction').addClass('activeListColor');
    });


    <div id="priceRange">
            <div class="header">Price Range<br /><a id="button1" href="javascript:toggle3('colcontent1','button1');" ><img src="images/more-info-button.png" width="76" height="20" /></a></div>
            <div class="col2 topSpace">Packages  start at $29.99/month</div>
            <div class="col3"><span>Best Value</span><img src="images/red-trophy.png" class="trophy" /><br />Packages  start at $19.99/month</div>
            <div class="col4 topSpace">Packages  start at $29.99/month</div>
    </div> <!-- End of priceRange div -->

<div id="satisfaction">
         <div class="header">Customer Satisfaction <br /><a id="button2" href="javascript:toggle3('colcontent2','button2');" ><img src="images/more-info-button.png" width="76" height="20" /></a></div>
            <div class="col2 topSpace">American  Customer Satisfaction Index (ACSI) Rating: 68 </div>
            <div class="col3"><span>Most Popular</span><img src="images/red-trophy.png" class="trophy" /><br />American  Customer Satisfaction Index (ACSI) Rating: 71 </div>
            <div class="col4 topSpace">American  Customer Satisfaction Index (ACSI) Rating: 61 </div>
    </div> <!-- End of satisfaction div -->

有什么建议吗？

Answer 1

当您更改页面时，DOM未及时准备好删除和添加高亮类。

所以你可以做的是设置一个全局变量，每当你加载你想要突出显示的列表项的页面时，你检查该变量的值并突出显示相应的列表项，然后使其无效。