使用 jquery 在特定页面上隐藏/显示 div

魔法艺术

那时我是网站代码的新手,我正在自学。我目前正在建立一个新网站,可以在这里看到:www.magik-arts.com,密码为 Testing 123。

我目前遇到的问题是我希望能够在指定页面上隐藏和显示某些 div 元素。例如,我有一个侧面导航,它在主页 /the-journey 上可见,我不想在任何其他页面上看到它。

然而,我在我的网站上使用了 ajax 加载,因此 css display: none 不起作用或触发。

我现在遇到了障碍,因为我不知道如何让它工作,所以任何帮助或指导将不胜感激。我想我将不得不使用 jquery 进行隐藏和显示,但我还不知道如何使用设置页面进行指定。

我是否需要执行 .click 操作来触发显示:无切换?或者有没有合适的方法来做到这一点?

任何建议将不胜感激。

提前致谢

原型

你的问题有很多可能的答案,我会尽量给你尽可能多的答案,详细的。

1) 仅在您希望显示的页面上包含侧边栏(使用 PHP)

如果您希望侧边栏打开,假设只有 5 页中的 3 页,然后创建一个sidebar.php包含侧边栏代码文件,并将include此页面放在您希望侧边栏打开的页面上。

阅读更多信息:http : //php.net/manual/en/function.include.php

2) 使用 jQuery

您可以设置侧边栏hidden,并在需要时随时切换它。使用 jQuery 可以轻松完成,这是一个示例:https : //jsfiddle.net/g5bwwtvd/

显然,您可以更改.toggle方法并让 jQuery 检测用户所在的当前页面,并根据用户所在的页面.toggle(或不)检测侧边栏。

请记住,这不是正确的做法,只是提及它以便您知道。

3)使用CSS(不推荐)

当您不想显示侧边栏时,您可以包含特定的 css 样式表,并且在此样式表中,您可以使用visibility: hidden, 和隐藏侧边栏display: none请记住,这样做不是一个好方法,因为您需要编写更多代码来隐藏某些内容。

我推荐这个ìnclude方法,因为这是一个很好的方法,它适用于几乎所有语言,不仅仅是网络语言。

编辑:添加 JavaScript 示例。

HTML

<div class="sidebar" hidden> // Hidden sidebar
  <p>
    I am the sidebar
  </p>
</div>

<p class="path">
</p>

JavaScript / JQuery

$(function(){

    var currPath = window.location.pathname; // Gets the current pathname ( /_display/ )

  $('.path').text('Current path is : '+ currPath);
  if(currPath == '/webpage.html'){ // Checks if the pathname equals the webpage you want the sidebar to be displayed on
    $('.sidebar').toggle(); // Set the sidebar to visibility: visible and display: block
  }else {}

})

演示

如果您想正确理解代码,请将 更改if(currPath == '/webpage.html')if(1 == 1),侧边栏现在将正确显示。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章