Question

我希望标题的背景在'index.html'上是透明的，在任何其他页面上都是不透明的。我试图通过Jquery和css来做到这一点。

我的标题：

<div class="nav"> ... </div>

标题的CSS：

.nav {
    height: 60px;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1000;
    transition: all 0.2s;
}

这是在$（窗口）加载时应该运行的代码，它通过查找'index.html'作为路径/ URL来确定是否使标题的背景透明：

$(window).on('load', function() {
    if(document.location.pathname.match(/[^\/]+$/)[0] == 'index.html'){
        $('.nav').removeClass('nav-visible');
        $('.nav').addClass('nav-hidden');
    }
    else {
        $('.nav').addClass('nav-visible');
        $('.nav').removeClass('nav-hidden');
    }
});

以下是使其可见或不可见的简单CSS：

.nav-visible {
    background-color: #f5f5f5;
}
.nav-hidden {
    background-color: rgba(245, 245, 245, 0);
}

无论页面如何，标题的背景总是加载为透明而不是不透明，而不是工作。页面（'index.html'）检测工作，我检查。 $（window）.on（'load'...）也会触发，if语句可以正常工作。只是if语句中的内容。

Answer 1

使用

$(doucment).bind("load", function(){
 alert("page is loaded");
});

如果这不起作用，也许你的jquery没有工作，那么你可以使用这个javascript函数，它肯定会工作

window.onload = function() {
 alert("page is loaded");
}

如果它确实发出警告，那么您应该检查并确保您的网页的路径名实际上是＆＃34; index.html＆＃34;通过测试函数实际为页面返回的内容（没有匹配）并打印出值，然后测试路径名与打印值的相等性。希望这会有所帮助...

Answer 2

对下面的内容发出警告，并查看它是否为“index.html”（在较小的情况下）

name

好的，$（'。nav'）会给你一个数组而不是单个元素，即使它是一个应用了css的单个元素，它也是一个包含单个元素的数组。使用$（'。nav'）[0] .removeClass

Answer 3

好的，我发现了这个问题，我正在使用jquery将我的index.html链接到header.html（我对标题进行全局编辑比更改所有10页＆＃39;标题更容易）。我的.js脚本中的其他所有内容都在标题上工作，但我想我是愚蠢的，并没有意识到它只是检测index.html是否加载，而不是header.html。谢谢！对不起，麻烦......经验教训

Jquery on'load'执行，但命令不工作

3 个答案: