如何使用切换添加和删除网址中的值?

时间:2015-05-12 19:11:23

标签: javascript jquery

我有以下代码,当用户点击切换显示内容时,我想在网址(http://www.somedomain.com/test.html#2111)中添加哈希和ID。关闭后,我想删除#2111。

如何使用切换功能?

CSS

.toggle{
    display:inline-block;
    height:48px;
    width:48px;
    background:url("http://icons.iconarchive.com/icons/pixelmixer/basic/48/plus-icon.png");
}
.toggle:after{
    content:"View All";
    display:block;
    height:48px;
    line-height:48px;
    width:288px;
    margin-left:48px;
}
.toggle.expanded:after{
     content:"Close All";
}
.toggle.expanded {
    background:url("http://cdn2.iconfinder.com/data/icons/onebit/PNG/onebit_32.png");
}

JQUERY

$(document).ready(function () {
            var $content = $("div.moreinfo").hide();

            $(".toggle").on("click", function (e) {
                $(this).toggleClass("expanded");
                if($(this).hasClass('expanded')) {
                    $("div.plus").hide().removeClass("closed");
                    $("div.minus").show().addClass("opened");   

                } else {

                    $("div.plus").show().addClass("closed");    
                    $("div.minus").hide().removeClass("opened");


                }
                $content.slideToggle();

            });
        });

1 个答案:

答案 0 :(得分:3)

您可以将location.hash设置为等于空字符串:

location.hash = '';

或将其设置为值:

$(document).ready(function () {
    var $content = $("div.moreinfo").hide();
    $(".toggle").on("click", function (e) {
        $(this).toggleClass("expanded");
        if($(this).hasClass('expanded')) {
           location.hash = someValue;
        } else {
           location.hash = '';
        }
        $content.slideToggle();

    });
});