如何在页面重新加载jquery后显示div和当前链接是否处于活动状态

时间:2015-11-07 06:59:23

标签: javascript php jquery html magento

我想显示一个div和一个活动的链接,在页面重新加载后单击该链接。最初类激活被调用到第一个链接并且div被隐藏。

我查看了我能想到的所有内容,但由于我的代码在页面重新加载后无效,因此无法获得解决方案。

请参阅html和jquery代码:

<div class="sub-cols" style="display:none;">
    <div class="wraper-berkowits">
    <a class="active" href="<?php echo Mage::getBaseUrl() ?>products-for-sale/attachments.html">Attachments</a>
    <a href="<?php echo Mage::getBaseUrl() ?>products-for-sale/removal.html">Removal</a></li>
    <a href="<?php echo Mage::getBaseUrl() ?>products-for-sale/hair-loss-store.html">Hair Loss</a></li>
    <a href="<?php echo Mage::getBaseUrl() ?>products-for-sale/care-maintenance.html">Care &amp; maintenance </a>
    </div>
</div>


jQuery(document).ready(function() {
    jQuery('.menu:first-child').addClass('first'); 

    jQuery('li.last a').click(function() {  
        jQuery('.sub-cols').show();
        return false;
    }); 

    jQuery(".sub-cols a").click(function () {        
        jQuery(this).addClass('active').siblings().removeClass('active'); 

    });
});

请检查上述代码,并告诉我如何获得所需的结果。

1 个答案:

答案 0 :(得分:1)

从你的评论中,现在可以更好地理解这个问题 因为您需要在页面重新加载后重新获得链接状态。 我可以为你提供实现它的暗示

有两种方式 - 1)你可以在PHP中使用$ _SESSION存储点击的链接,并可以使用jquery显示它

2)仅使用javascript -    使用window.localStorage - 存储没有过期日期的数据

当您需要设置应在下一页中反映的变量时,请使用:

var someVarName = "value";
localStorage.setItem("someVarName", someVarName);

在您的代码中,您可以执行类似的操作

jQuery(".sub-cols a").click(function () {
        localStorage.setItem("someVarName", jQuery(this).text());
        jQuery(this).addClass('active').siblings().removeClass('active');
    });
    jQuery(".sub-cols").show();

在任何页面中(例如页面加载时),请将其命名为:

var someVarName = localStorage.getItem("someVarName");

.getItem()将返回null或存储的值。

您的示例可以像这样使用

if(localStorage.getItem("someVarName")!=null){
        $('a').filter(function(){
                return this.innerHTML == localStorage.getItem("someVarName"); 
            }).css({background:"#F00"});
    }

我提供了更新的演示 - http://jsfiddle.net/bvqnzuwa/3/ 要测试它,请单击任何链接,然后重新加载页面。即使在页面重新加载后,您也会在链接上看到背景颜色。