HTML - 从另一个 HTML 页面运行 Javascript？答案

【问题标题】：HTML - Running Javascript from another HTML page?HTML - 从另一个 HTML 页面运行 Javascript？
【发布时间】：2015-08-26 13:19:06
【问题描述】：

我正在开发我的网站，但我对菜单有一个大问题。一些 HTML 文件包含更多页面，所以我希望所有页面都可以从菜单中直接访问。

请查看以下网站：http://tuinhierhamont.be/beta/index.html

当您想进入一个信息页面时，您可以从菜单中选择它，但它只有在您已经在信息页面上时才可见。这意味着您必须选择页面两次。

请告诉我如何防止这种情况发生。

Javascript：

<script>
function show(shown, hidden, hidden2) {
window.location = 'info/index.html';
document.getElementById(shown).style.display='block';
document.getElementById(hidden).style.display='none';
document.getElementById(hidden2).style.display='none';
return false;
}
</script>

html 菜单

<div id="menu">
    <ul id="nav">
            <a href="index.html">
                <div id="menuitem">Home</div>                   
            </a>
            <li><a href="#">
                <div id="menuitem">Info</div>                    
            </a>
                        <ul>                
                                <li><a href="info/index.html" onclick="return show('Page1','Page2','Page3');">Doelstelling</a></li>
                                <li><a href="info/index.html" onclick="return show('Page2','Page1','Page3');">Bestuur</a></li>
                                <li><a href="info/index.html" onclick="return show('Page3','Page1','Page2');">Lid worden</a></li>
                        </ul>
                </li>
            <a href="activiteiten/index.html">
                <div id="menuitem">Activiteiten</div>                   
            </a>
            <a href="fotos/index.html">
                <div id="menuitem">Foto's</div>                  
            </a>
            <a href="links/index.html">
                <div id="menuitem">Links</div>                   
            </a>
            <a href="tehuur/index.html">
                <div id="menuitem">Te huur</div>
            </a>
    </ul>
</div>

INFO 页面上的 html

<div id="Page1" style="display:none">


text

</div></br>

<div id="Page2" style="display:none">


text


   </p>

</div></br>
<div id="Page3" style="display:none">

text

</div></br>

请查看网站link 了解我的意思，尝试打开信息页两次。

【问题讨论】：

只制作3个不同的页面？你为什么要让自己这么难？
我想这将是目前最好的选择。谢谢。
如果您想保持单页，请在链接的 href 属性中使用哈希链接，并在文档中添加 onhashchange 处理程序以检测导航。但在这种情况下，火影忍者给出了最好的答案。
你到底为什么想要这样的行为？

标签： javascript php jquery html css

【解决方案1】：

我也建议用 URL 参数解决这个问题：

http://tuinhierhamont.be/beta/info/index.html?page=info&external=true

然后你可以在页面加载时检查url参数。根据参数值，您可以显示和隐藏内容。读取 url 参数的代码可能类似于：

function getParam(variable){  
  var query = window.location.search.substring(1);   
  var parameter = query.split("&");  
  for (var i=0; i< parameter.length; i++) {    
        var pair = parameter[i].split("=");   
        if(pair[0] == variable){
          return pair[1];
        }
   }     
}
var external = getParam('external');
var page = getParam('page');

【讨论】：

【解决方案2】：

在 url 中使用字符串值并在 jquery 中添加条件以显示什么 div，如果查询中存在某些内容。

例如：链接/index.html#external

并添加条件：如果查询中存在“external”，则显示 div id='external'，隐藏其他所有内容..

【讨论】：