Question

目标：
当您输入地址计算或project.html时，菜单中的一个主要元素应根据您输入的网页标记背景颜色。例如，如果您要输入calculate.html，则应通过将其他背景颜色与其他颜色进行比较来选择名为Calculation（从菜单中）的选项。

问题：

我不知道如何通过拥有背景颜色来制作标记点击了链接。我希望代码用jQuery编写。

如果可能的话，在元素“a href”中添加“id”以更改背景颜色会很棒。

来自jQuery的值“Project”和“calculation”是来自html代码的元素标题的值。

HTML：

<div id="nav-menu">
    <ul id="kthh">
        <li><a href="calculation.html">Kalkylering</a></li>
        <li><a href="project.html">Projekt</a></li>
    </ul>
</div>

Javascript：

$(document).ready(function() 
{

var data = $('title'); 

    if(data[0].textContent == "Project")
    {
        $('#kthh').closest('li').next('li').find('a').addClass("asdd");

    }
    if(data[0].textContent == "calculation")
    {
        //$('title').html('someHTML'); 
    }

}); // ready

CSS：

/* Menu for display */

#nav-menu ul
{
    list-style: none;
    padding: 0;
    margin: 0;
}

#nav-menu li
{
    float: right;
}

#nav-menu li a
{
    height: 70px;
    line-height: 110px;
    float: left;
    padding-left: 13px;
    padding-right: 13px;
    display: block;
    color: #FFFFFF;
    text-decoration: none;
    text-align: center;
    font-family: Verdana;
    font-weight:bold;
}

#nav-menu li a:hover {  background: #AA1133;}

#nav-menu li.last-child { padding-right: 50px;}

.asdd
{
    background: #AA1133;
}

Answer 1

我认为您不应该使用textcontent，而应使用text：

$(document).ready(function() 
{

    var data = $('title'); 

    if(data[0].text () == "Project")
    {
        $('#myFirstButton').addClass("asdd");

    }
    if(data[0].text() == "calculation")
    {
        //...
    }

});

您还可以通过在所有按钮中添加ID来简化您的生活：

<div id="nav-menu">
    <ul id="kthh">
        <li><a id="myFirstButton" href="calculation.html">Kalkylering</a></li>
        <li><a id="mySecondButton" href="project.html">Projekt</a></li>
    </ul>
</div>

在网页中添加背景颜色

1 个答案: