书签点击时的 Javascript 操作

Question

我正在运行一个 Wordpress 站点(Divi 主题)，它能够向特定页面添加代码。我有一个页面，左侧边栏显示目录，中间文本包含描述，右侧边栏包含示例。该网站位于:logan.pverify.com/rest-api。

当用户单击目录时，它是一个超链接书签#foo。那部分很好。但我希望 javascript 在右侧边栏上启动并显示代码示例(我设想这是一系列隐藏或可见的 div)。整个内容只有 5 个左右的部分，所以还不错。

无论如何。我不知道是否可以做到这一点。我设法让 js 代码工作。可笑，但这只是一个开始。我主要是一个 C# winforms 人员。

<script>
jQuery(function($){
    alert('hello');
});
</script>

Answer 1

您需要做的就是首先在 CSS 中默认隐藏该元素，然后使用 .on() method 将单击事件处理程序附加到可见元素。 。此处理程序应使用 .css() method 更改不可见元素的 CSS display 属性(在本例中为 block)。 :

$("#visible").on("click", function() {
  $("#hidden").css("display", "block");
});

#hidden {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="visible">
  Visible
</button>

<div id="hidden">
  Hidden content
</div>

希望这有帮助! :)