Question

我有一个带有4个按钮的页面（... contacts.asp）。

单击按钮时，将打开其关联的div部分，并折叠其他3个部分。这个逻辑工作得很好。

现在我想从另一个页面链接到此页面，但是按照网址链接中的div哈希的指示打开关联的#tag部分http .... contacts.asp #Sales 。

我的代码如下，我添加了if语句，希望它可以工作，但事实并非如此。

function showhide(id) {
    document.getElementById('Corporate').style.display = "none";
    document.getElementById('Outlets').style.display = "none";
    document.getElementById('Sales').style.display = "none";
    document.getElementById('Service').style.display = "none";

    var e = document.getElementById(id);
    e.style.display = (e.style.display == 'block') ? 'none' : 'block';
}

if ( location.hash != 0 && location.hash == '#Sales' ){
    document.getElementById('Sales').style.display = "block";
}

Answer 1

相关代码可能会提前执行。

更准确地说，这段代码：

if ( location.hash != 0 && location.hash == '#Sales' ) {
document.getElementById('Sales').style.display = "block";
}

执行后，'#Sales'DOM-Element可能还不存在，因为DOM尚未完全加载。因此执行此操作不会发生任何事情。

这意味着必须在加载DOM后执行代码。为此，例如'DOMContentLoaded'事件。（您也可以使用'onload'事件。）

作为解决方案，您应该在该事件处理程序中编写代码：

document.addEventListener("DOMContentLoaded", function() {
    // the if statement
});

链接到另一个页面并自动切换隐藏的div

1 个答案: