如何创建指向隐藏 div 的链接？答案

【问题标题】：How to create link to a hidden div?如何创建指向隐藏 div 的链接？
【发布时间】：2014-12-11 18:16:43
【问题描述】：

我有一个包含 div 的 html 文件。默认情况下，所有 div 都是隐藏的，并且每个 div 都有一个关联的按钮来取消隐藏它们（javascript）。

如何在另一个站点上创建指向其中一个 div 的外部链接，并加载显示给定 div 的页面？ http://example.com/page.html#div1 有效，但 div 被隐藏。

<script type="text/javascript">
    $(document).ready(function(){
        $("#div1").hide();
        $("#div2").hide();
        $("#div3").hide();

        $("#btn1").click(function(){
            $("#div1").show();
            $("#div2").hide();
            $("#div3").hide();
  });

  $("#btn2").click(function(){
            $("#div1").hide();
            $("#div2").show();
            $("#div3").hide();      
  });   

  $("#btn3").click(function(){
            $("#div1").hide();
            $("#div2").hide();
            $("#div3").show();
  });

});</script>

【问题讨论】：

你是在问链接打开后如何显示 div 吗？
@LorenzoMarcon 我在问如何显示链接包含的那个 div。
在url中添加一些你想要显示的div，http://example.com/page.html?show_div=1，然后在页面上用javascript显示对应的div
他们是visibility:hidden 还是display:none？如果是后者，那么只需从 URL 和 $.show() 使用其 id 的 div 获取哈希@
你的代码在哪里？

标签： javascript html hyperlink

【解决方案1】：

首先，从 url 中获取正确的 var（例如，div1）：

function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
    results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

然后，创建一个 jQuery 函数，该函数将检查 url 字符串并生成 url 中引用的 div。

var divId = getParameterByName('div');

$("#div"+divId).show();

就是这样。

注意：您的网址应如下所示：http://example.com/page.html?div=1

【讨论】：