当URL包含某些文本部分时是否显示和隐藏元素?

时间:2019-01-29 作者:Michael Elliott

我要求在URL中包含“/category-1/”的所有页面上显示#nav1,隐藏#nav2。

我要求在URL中包含“/category-2/”的所有页面上显示#nav2,#nav1。

我有以下代码:

    <script>  

var url = window.location.href;

if (url.indexOf("/category-1/") > -1)
{
    document.getElementById(\'#nav1\').style.display = \'none\';
    document.getElementById(\'#nav2\').style.display = \'true\';
}

else if (url.indexOf("/category-2/") > -1)
{
    document.getElementById(\'#nav2\').style.display = \'none\';
    document.getElementById(\'#nav1\').style.display = \'true\';
}

</script>
但它似乎没有任何效果。

谢谢,迈克尔

1 个回复
SO网友:Jacob Peattie

true 不是的有效值display 在CSS中。您需要使用valid values for the display property 或空字符串以删除样式替代。

如果两个菜单的样式都是默认显示的,那么最好是添加和删除display: none;, 而不是在显示时设置特定值:

if (url.indexOf("/category-1/") > -1)
{
    document.getElementById(\'#nav1\').style.display = \'none\';
    document.getElementById(\'#nav2\').style.display = \'\';
}

else if (url.indexOf("/category-2/") > -1)
{
    document.getElementById(\'#nav2\').style.display = \'none\';
    document.getElementById(\'#nav1\').style.display = \'\';
}
如果您可以控制主题的模板,那么最好在模板中隐藏并显示正确的导航。您可以使用is_category() 检查您是否正在查看特定类别的存档,或has_category() 要检查当前帖子是否具有该类别,请执行以下操作:

<?php if ( is_category( \'category-1\' ) || ( is_single() && has_category( \'category-1\', get_queried_object() ) ) ) : ?>
    <nav id="nav1"></nav>
<?php elseif ( is_category( \'category-2\' ) || ( is_single() && has_category( \'category-2\', get_queried_object() ) ) ) : ?>
    <nav id="nav2"></nav>
<?php endif; ?>

相关推荐

我可以使用<脚本>直接插入JavaScript吗?

我对建立Wordpress网站很陌生,所以如果我不能正确描述事情,请原谅我。有一个网站提供。屏幕上飞行蝙蝠的js文件。https://www.delphitools.info/2013/10/30/pimp-your-website-with-an-halloween-bat/它说我可以使用<script async src=\"https://cdn.delphitools.info/wp-content/uploads/2013/10/jsbat.js\"></script>&