javascript - 使用 javascript 删除主页内容

Question

我想在点击其他链接后隐藏我的主页内容。我的主页内容是成

<div class="active">
Homepage content
        </div>

css 类激活和非激活

.active {   
    margin-top:230px;
    font-size: 30px;
    color:black;
 }  
.inactive
{
    opacity:0;
}

我试过这个脚本，但它不起作用。

   <script src="jquery.js"></script>
    <script>
    $("#link-link1").click(function(){
        $(this).removeClass("active").addClass("inactive");

                                        });
    </script>

我将它上传到虚拟主机以便您可以看到完整的 html 代码 here和完整的 CSS 文件 here

Answer 1

$(this).removeClass("active").addClass("inactive");

在你的链接中添加和删除类(我假设它有 id="#link-link1)

相反，你需要给你的 div 一个 id，比如

<div id="homepage" class="active">

然后在你的 JS 代码中通过 id 引用它:

$('#homepage').removeClass("active").addClass("inactive");

更好的方法是使用 jquery 的 hide() 方法或 toggle() 如果您希望它在您下次单击时返回:

$('#homepage').toggle();