用url显示隐藏的div和jquery

时间:2015-05-27 13:10:21

标签: jquery url web

我是我们jquery按钮点击显示/隐藏divs哪个效果很好但我希望能够使用url显示div:例如:somesite.com/page.php#ShowThisDiv

这是我正在使用的jquery:

$(function () {
    $('#Options ul li a').on('click', function (e) {
        e.preventDefault();
        var newcontent = $(this).attr('href');

        $('#Options ul li a').removeClass('sel');
        $(this).addClass('sel');

        $('#Info section').each(function () {
            if (!$(this).hasClass('hidden')) {
                $(this).addClass('hidden');
            }
        });

        $(newcontent).removeClass('hidden');
    });
});

请提出任何建议。

1 个答案:

答案 0 :(得分:0)

您可以使用普通的javascript从网址中获取ID:

var url = 'http://somesite.com/page.php#ShowThisDiv';
var id = url.substring(url.lastIndexOf('#'));
alert(id); //outputs #ShowThisDiv

<强>更新

function loadDiv() {
    var url = window.location; //Example: http://somesite.com/page.php#ShowThisDiv
    var id = url.substring(url.lastIndexOf('#'));
    $(id).show(); //Displays the div #ShowThisDiv
}

loadDiv();

更新2

HTML

<div class="divs" id="div1">...</div>
<div class="divs" id="div2">...</div>
<div class="divs" id="div3">...</div>
<div class="divs" id="div4">...</div>

JS

function loadDiv() {
   //Hide divs
   $('.divs').hide();

   //Get div to show
   var url = window.location; //Example: http://somesite.com/page.php#div1
   var id = url.substring(url.lastIndexOf('#'));

   //Show div
   $(id).show(); //Displays the div #div1
}

loadDiv();
相关问题