Question

我的HTML：

<div class="menu">
    <a href="javascript:displayonediv('sections1');">Energy Profile</a>
    <a href="javascript:displayonediv('sections2');">Statistics</a>
</div>

<div name="sections" id="sections1">
    .... some stuff ....
</div>
<div name="sections" id="sections2">
    .... some stuff ....
</div>

我的JavaScript代码：

function displayonediv(choosendiv) {
    $('div[name|="sections"]').each(function(index) {
        if ($(this).attr("id") == choosendiv) {
            $(this).show(200);
        }
        else {
            $(this).hide(200);
        }
    });
}

默认情况下，当隐藏div id=sections1时，会在页面加载时显示div id=sections2。在我提交表单后，在我的控制器中，我将div重定向到id=sections2。但是，我似乎无法重定向到该页面并加载该特定div（id=sections2）。我曾试图使用锚标签，但我的努力一直都是徒劳。

Answer 1

我认为你应该这样做：

隐藏CSS中的所有部分，以便在加载期间甚至不可见：

#sections1, #sections2 {
    display: none;
}

CSS是可选的。使用这个简单的函数来进行动态显示和隐藏：

function displayonediv(chosendiv) {
    //Make sure all other divs are really hidden if there are subsequent calls:
    $("div[name^=sections]").hide(200);
    $("#" + chosendiv).show(200);
}

此外：

如果这不起作用，您可以更改可怕的HTML，则按如下所示更改HTML。

<div class="menu">
    <a class="section" href="#sections1">Energy Profile</a>
    <a class="section" href="#sections2">Statistics</a>
</div>

<div class="sections" id="sections1">
    .... some stuff ....
</div>
 <div class="sections" id="sections2">
    .... some stuff ....
</div>

有这个js：

$("a.section").click(function(event) {
    $("div.sections").hide(200);
    $($(this).attr('href')).show(200);
});

与jQuery中的大多数内容一样，您的所有代码都应该是$(function(){ /*here*/});。

要在加载页面时加载部分：

$(function() {
    $(window.location.hash).show(200);
});

Answer 2

尝试删除名称后的|，并将其替换为$，或将其保留。我甚至会从div中删除名称部分，然后向他们添加一个类，然后使用$('.sections').each()。

如何重定向到已隐藏但现在需要显示的页面上的特定div

2 个答案: