jquery - 添加了 addclass 的 css 在加载页面时不起作用

Question

我有一个带有以下链接的菜单栏。

<div class="menu">
<ul>
  <li><a href="aboutus.php" onclick="changecss(1)">About Us</a></li>
  <li><a href="services.php" onclick="changecss(2)">Services</a></li>
  <li><a href="career.php" onclick="changecss(3)">Career</a></li>
  <li><a href="contactus.php" onclick="changecss(4)">Contact Us</a></li>
</ul>
</div>

我想在菜单栏中激活当前页面链接。所以我正在使用 addclass 方法..

$(".menu ul li a").click(function() 
{
  $(".menu ul li a").removeClass('selected');
  $(this).addClass('selected');
});

所有这些代码都位于 header.html 页面中，这是我的头文件。我在所有其他页面中使用 php 包含此页面。

问题是当我点击菜单栏链接时，addclass 正在工作，但是当页面加载(到 href 页面)时，addclass 的 CSS 将无法工作。任何人都可以帮助解决问题吗？

Answer 1

您是否使用文档准备方法？如果没有，那就是你的问题。当您执行 jQuery 代码时，DOM 并未完全加载。像这样执行你的代码:

$(function(){
    $(".menu ul li a").click(function() { 
        $(".menu ul li a").removeClass('selected'); 
        $(this).addClass('selected'); 
    });
});

...或者...只是在页面底部的脚本标记中执行您的代码(就在结束 body 标记之前)。

作为侧节点:

$(function() {});

是

的缩写

$(document).ready(function(){ ... });