javascript - 隐藏由 anchor 的 href 选择

Question

我正在尝试找出一个允许我隐藏 divs 并在点击引用链接时显示它们的函数。

很难解释，但这是我要找的:

<ul>
   <li><a href="#id-1">Link 1</a></li>
   <li class="active"><a href="#id-2">Link 1</a></li>
   <li><a href="#id-3">Link 1</a></li>
<ul>
<div id="id-1">Some content</div> // Hidden
<div id="id-2">Some content</div> //  This should only show in document
<div id="id-3">Some content</div> // hidden

每当其他 anchor 被点击时，其他 div 应该隐藏。

我希望他说得有道理，并提前感谢您的帮助

主场

Answer 1

您可以使用类似这样的东西(未经测试，因此可能需要调整):

$(document).ready(function() {              //fires on dom ready

    $("a").click(function(e) {              //assign click handler to all <a> tags

        $(".classForYourDivs").hide();      //hide all divs (put class on ones you want to hide)

        var element = $(e.target);
        var href = element.attr("href");    //get the attribute

        $(href).show();                     //show the relevent one
        return false;                       //important to stop default click behavior of link
    });

});

顺便说一句，你应该考虑使用 href 以外的东西来存储这些信息......看看 jquery data() 函数的文档