通过 href 链接链接到另一个页面并切换隐藏的文本答案

【问题标题】：Link to another Page via href link and toggle a hidden Text通过 href 链接链接到另一个页面并切换隐藏的文本
【发布时间】：2016-10-15 21:55:34
【问题描述】：

我想点击 site1 上指向 site2 的链接，如果点击了该链接，则该页面上的隐藏文本（此处为：text_1_toggle）应该是可见的。

附：我对这个话题很陌生..如果我不能马上理解你的答案，请原谅我:)

站点 1：

<html>
<head>
</head>
<body>

  <a href="site2.htm#text_1_toggle">Click me!</a>

</body>
</html>

站点2：

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="toggle.js"></script>
  <style>
        h4:hover
        {
            cursor: pointer; 
            cursor: hand;
        }
        #text_1_toggle
        {
            display: none;
        }
    </style>
</head>
<body> 
  <div id="site">
      <h4 id="text_1">Text 1</h4>
      <span id="text_1_toggle">     
      1 some text...
      </span>

    <h4 id="text_2">Text 2</h4>
      <span id="text_2_toggle">     
      2 some text...
      </span>   
  </div>
</body>

toggle.js

jQuery("#site").ready(function()
{
  jQuery("#text_1").click(function()
  {
    jQuery("#text_1_toggle").toggle();
  });    

  jQuery("#text_2").click(function()
  {
    jQuery("#text_2_toggle").toggle();
  });
});

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

您可以使用变量来检查 site1 链接上的点击事件，然后在 site2 上使用该变量。有关更多信息，请参阅此内容：http://www.xul.fr/javascript/parameters.php

【讨论】：

【解决方案2】：

你描述的效果可以用CSS来实现。

您需要为要显示的元素使用:target 伪选择器。当您在 URL 中使用此哈希时，您可以选择设置样式（包括设置 display）#text_1_toggle 元素，例如，可以将以下内容添加到您的 CSS：

#text_1_toggle:target {
    display: inline;
}

【讨论】：