Javascript jQuery不更新CSS属性

Javascript jQuery不更新CSS属性,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我很难弄清楚为什么CSScolor和“文本装饰”属性没有通过我这里的“menulight”函数应用 当我将鼠标悬停在菜单项上时,“字体重量”和“字体系列”工作正常 为了保持简洁,我删去了其他函数正在应用的其余代码 编辑:添加了代码的其余部分 <!DOCTYPE html> <html> <head> <title>Meetings &#038; Events | The Landon Hotel</title> <link

我很难弄清楚为什么CSS
color
和“文本装饰”属性没有通过我这里的“menulight”函数应用

当我将鼠标悬停在菜单项上时,“字体重量”和“字体系列”工作正常

为了保持简洁,我删去了其他函数正在应用的其余代码

编辑:添加了代码的其余部分

<!DOCTYPE html>
<html>
<head>
<title>Meetings &#038; Events | The Landon Hotel</title>
<link rel="stylesheet" href="style/style.css">
<script src="../../jquery-1.11.1.js"></script>
<script type="text/javascript">
    $(function() {
        $("div.event").hover(highlight);
        $("#menu-main-menu a").hover(menulight);
    });
    function highlight(evt) {
        $(this).toggleClass("divhover");
    }
    function menulight(evt) {
        $(this).toggleClass("menuhover");
    }
</script>
    <style type='text/css'>

        .divhover {
            background-color:cornsilk;
        }
        .divhover .eventDate {
            text-decoration: underline;
            font-weight: bold;
            font-family: times new roman;
            color:magenta;
        }
        .menuhover  {
            font-weight: bold;
            color:magenta;
            font-family: cursive;
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header"><img src="img/header.png"></div>
        <div id="hero">
            <div class="current"><img src="img/HomePageImages/Paris.jpg"></div>
        </div>
    <nav class="main-navigation" role="navigation">
        <div>
            <ul id="menu-main-menu" class="nav-menu">
                <li><a href="index.html">Home</a></li>
                <li><a href="restaurant-to-room-service.html">Room Service</a></li>
                <li><a href="specials.html">Specials</a></li>
                <li><a href="reservations.html">Reservations</a></li>
                <li><a href="meetings-events.html">Meetings &#038; Events</a></li>
                <li><a href="news.html">News</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </div>
    </nav>
    <div class="content">

        <h1>Meetings &#038; Events</h1>
        <p>All of the following meetings take place in the Bernal Height Landon Hotel in San Francisco, in their new, state-of the-art conference room.</p>
        <hr/>

        <div class="event">
        <h3>23rd Annual Inventors International Exhibition and Conference:</h3>
        <img width="220px" src="img/inventors_international.jpg"> 
        <ul><li id="eventDate" class="eventDate">Friday, October 31st through Sunday, November 2nd 2014</li></ul>
        <p>The best scientific minds, showing their riveting and forward-thinking inventions, will be in-house for a science and technology-packed weekend. The halls, conference room, and lobby of the Bernal Heights Landon Hotel will be brimming with exhibits, presentations, and demonstrations - providing something for everyone in the family.</p>        
        </div>

        <div class="event">
        <h3>KinetEco, Inc. Solar Seminar:</h3>
        <img class="meeting-right" src="img/solar_conference.jpg"> 
        <ul><li class="eventDate">Friday, November 7th through Sunday, November 9th 2014</li></ul> 
        <p>San Francisco's own KinetEco, Inc. has been a trailblazer in solar energy for the past two decades, and has solarized thousands of businesses and residences throughout the world. Join their talented team of engineers and scientists for this not-to-be-missed event that will explore solar as the must-have energy source of the present and future.</p>
        </div>

        <div class="event">
        <h3>Classic Car Social:</h3> 
        <img class="meeting-left" src="img/classic_car.jpg">
        <ul><li class="eventDate">Tuesday, November 11th through Wednesday, November 12th  2014</li></ul>
        <p>Join other classic car enthusiasts for the monthly classic car social. Bring your car to showcase and share your hobby with others, and enjoy a hearty breakfast buffet. Reservations are required, as parking space is limited for the event.</p>  
        </div>

        <div class="event">
        <h3>Hansel &#038; Petal California Native Gardening Seminar:</h3>
        <img class="meeting-right" src="img/california_natives.jpg">
        <ul><li class="eventDate">Friday, November 21st through Sunday, November 23rd 2014</li></ul>
        <p>With California's current drought situation, never has it been timelier to attend one of Hansel &#038; Petal's informative seminars on native gardening. You'll learn how to select and layout plants for an attractive and drought-resistant landscape. In addition, a tour of some of the best local native gardens will be offered on Saturday morning.</p>
        </div>
    </div>
    </div>
</body>
</html>

会议&次;活动|兰登酒店
$(函数(){
$(“div.event”)。悬停(突出显示);
$(“#菜单主菜单a”)。悬停(菜单右键);
});
功能突出显示(evt){
$(this.toggleClass(“divhover”);
}
功能菜单灯(evt){
$(this.toggleClass(“menuhover”);
}
.divhover{
背景颜色:玉米丝;
}
.divhover.eventDate{
文字装饰:下划线;
字体大小:粗体;
字体系列:时代新罗马;
颜色:洋红色;
}
梅努霍夫先生{
字体大小:粗体;
颜色:洋红色;
字体系列:草书;
文字装饰:下划线;
}
会议&次;事件 所有的会议都在旧金山贝纳尔高兰登酒店,在他们新的、最先进的会议室举行。


第23届年度发明家国际展览和会议: 2014年10月31日星期五至11月2日星期日 最优秀的科学头脑,展示他们引人入胜和前瞻性的发明,将在一个科技密集的周末呆在家里。伯纳尔高地兰登酒店的大厅、会议室和大厅将充满展品、演示和演示,为家庭中的每个人提供一些东西。

KinetEco,Inc.太阳能研讨会: 2014年11月7日星期五至11月9日星期日 旧金山自己的KinetEco,Inc.在过去二十年中一直是太阳能领域的先驱,为全球数千家企业和住宅提供了太阳能。加入他们才华横溢的工程师和科学家团队,参加这个不容错过的活动,探索太阳能作为当前和未来必备能源的可能性

经典汽车社交: 2014年11月11日星期二至11月12日星期三 加入其他经典汽车爱好者,参加每月经典汽车社交活动。带着你的车去展示,和其他人分享你的爱好,享受丰盛的自助早餐。需要预订,因为活动的停车位有限。

汉塞尔&;佩塔尔加州本土园艺研讨会: 2014年11月21日星期五至11月23日星期日 鉴于加州目前的干旱状况,参加Hansel&;Petal关于本地园艺的信息研讨会。您将学习如何选择和布局植物,以形成具有吸引力和抗旱性的景观。此外,周六上午还将参观当地一些最好的本土花园

这是因为
#menulight a
在CSS中的优先级高于类选择器
.menuhover
。字体大小和字体系列可以被覆盖的事实表明了这一点,因为这些属性没有在具有更高首选项的选择器中声明。您应该使用
#菜单主菜单a.menuhover

    #menu-main-menu a {
        color: green;
    }
    #menu-main-menu a.menuhover  {
        font-weight: bold;
        color:magenta;
        font-family: cursive;
        text-decoration: underline;
    }

是否包含jQuery库?是否确定
$(此)
引用的是一个元素而不是
窗口
对象?是的,我确实包含了jQuery库,为了清晰起见,这里我只添加整个页面代码。除非我缺少一些东西,否则我不确定在CSS可以处理:hover时是否有必要通过JS执行此操作:,:焦点锚的样式,等等。例如,事件:hover{background:…}。事件:hover.eventDate{}。这个类正在被切换,所以我认为这无关紧要?还有,为什么文字装饰不起作用?我想我明白你的意思了。非常感谢。这确实很重要:一个被切换的类被视为与任何类一样,标准的CSS优先级计算将发生。除非您正在使用
.css()
进行重写,这将内联写入样式。内联样式的优先级高于样式表中声明的任何属性,但带有
的属性除外!重要信息
后缀。是否加载了指定锚元素文本装饰属性的替代样式表?啊,是的,好的。如果你不介意的话。我试图删除#menu main menu a{color:green;}并保留原始代码,即使没有更高的选择器,颜色和文本装饰也不起作用。有什么想法吗?这可以帮助您:-
#菜单主菜单a
具有
0-1-0-1
。menuhover
具有
0-0-1-0
的特性,比第一个更低。