jQuery-在定义列表中显示答案

Question

我有一个常见问题页面，看起来像下面显示的标记

页面加载后，我想显示与URL中的书签相对应的答案

该网址的格式为www.mydomain.com/page#q1

我正在尝试这样做，但无法正常工作-关于如何解决它的任何想法？

console.log($(hash).length)

的长度为1，因此正在选择dom元素

而且我使用了相同的功能来在单击脚本时进一步单击以显示它-这样就可以了

$(function () {

        var hash = window.location.hash;
        //hash = hash.replace('#', '');
        console.log('hash:' + hash);
        console.log($(hash).length);

        $(hash)
            .parent()
            .parent()
            .find("dd.answer")
            .slideToggle();

        $("dd.answer")
                .hide();

        $("dt.question")
                .click(function () {
                    $(this)
                        .parent()
                        .find("dd.answer")
                        .slideToggle();
                });
    });

<dl>
    <dt class="question">
        <a id="q1"></a>
        Question 1
    <dd class="answer" style="display: none;">
        Answer 1
    </dd>
</dl>
<dl>
    <dt class="question">
        <a id="q2"></a>
        Question 2
    <dd class="answer" style="display: none;">
        Answer 2
    </dd>
</dl>
<dl>
    <dt class="question">
        <a id="q3"></a>
        Question 3
    <dd class="answer" style="display: none;">
        Answer 3
    </dd>
</dl>

Answer 1

您在使用哈希显示后隐藏了dds。

试试这个代替：

<html>

    <head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script>
    $(function () {

        var hash = window.location.hash;
        //hash = hash.replace('#', '');
        console.log('hash:' + hash);
        console.log($(hash).length);

        $('dd').hide();

        $(hash).parents('dl').find('dd').slideToggle()

        $("dt.question")
                .click(function () {
            $(this)
                        .parent()
                        .find("dd.answer")
                        .slideToggle();
        });
    });

</script>
</head>

<body>

<dl>
    <dt class="question">
        <a id="q1"></a>
        Question 1
    <dd class="answer" >
        Answer 1
    </dd>
</dl>
<dl>
    <dt class="question">
        <a id="q2"></a>
        Question 2
    <dd class="answer" >
        Answer 2
    </dd>
</dl>
<dl>
    <dt class="question">
        <a id="q3"></a>
        Question 3
    <dd class="answer" >
        Answer 3
    </dd>
</dl>

</body>

</html>

Answer 2

尝试这个：

var hash = "#" + window.location.hash;

由于网址中的原始#已删除，因此它是哈希开始的指示。
JQuery希望ID选择器以#开头，因此您必须自己添加它。