.hover（）在jQuery中不起作用
我尝试创建一个jQuery函数.hover来通过使用另一个类并使用hover来修改div的背景颜色，方法是将hover用于addClass和removeClass。
HTML：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script type='text/javascript' src='script.js'></script>
<title>Untitled 1</title>
</head>
<body>
<div>HOME</div>
<div>ABOUT</div>
<div>CONTACT</div>
</body>
</html>
CSS：
div {
display:inline;
font-family: Helvetica;
color: white;
background-color:#FF6666;
padding: 20px;
}
.hltd {
display:inline;
font-family: Helvetica;
color: black;
background-color:#66FF33;
padding: 20px;
}
JavaScript：
$(document).ready(function(){
$('div').hover(
function(){
$(this).addClass('hltd');
},
function(){
$(this).removeClass('hltd');
}
);
});
共有1个答案
您还没有包含Jquery库。包括在脚本之前：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type='text/javascript' src='script.js'></script>
null
$(document).ready(function() {
$('div').hover(
function() {
$(this).addClass('hltd');
},
function() {
$(this).removeClass('hltd');
}
);
});div {
display: inline;
font-family: Helvetica;
color: white;
background-color: #FF6666;
padding: 20px;
}
.hltd {
display: inline;
font-family: Helvetica;
color: black;
background-color: #66FF33;
padding: 20px;
}<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type='text/javascript' src='script.js'></script>
<title>Untitled 1</title>
</head>
<body>
<div>HOME</div>
<div>ABOUT</div>
<div>CONTACT</div>
</body>
</html>-
问题内容： 我有一个简单的代码： 和这个CSS： 问题是：当我将光标从移到（应该是可见的，因为它是的子级）时，鼠标悬停被禁用了。我正在IE7中对其进行测试，在FF中它可以正常工作。我究竟做错了什么？我还意识到，当我删除标签时，它就不起作用了。有任何想法吗？ 问题答案： IE7不允许您将伪类应用于非锚元素，除非您明确指定doctype。只需在页面上添加一个doctype声明，它就可以正常工作。
-
问题内容： 我正在编写ajax Web应用程序，但是由于任何原因，当我在Internet Explorer 9（IE9）中对内部数据服务执行GET时，它都无法正常工作。同样的调用在Chrome，Firefox和Safari中也可以正常工作。我正在使用本地主机Web服务器（沼泽）进行开发，并且正在与要尝试的数据服务在同一网络上进行开发。我正在使用Jquery 1.8.1（我返回了几个版本，但仍然看到
-
问题内容： 无法在Angular控制器的$ viewContentLoaded事件中调用jquery函数，以下是相同的代码。 这里需要任何配置吗？我什至尝试了noConflict（）; var $ jq = jQuery.noConflict（）; 是否需要其他配置？ 谢谢阿卜杜勒 问题答案： 首先，不要从控制器进行DOM操作。而是从指令执行。 您可以在指令链接方法中执行相同的操作。您可以访问在其
-
问题内容： 我有一个Ajax脚本，可以将一些数据发送到外部URL。外部URL托管在同一服务器上，但是域与ajax调用的源不同。 这在Firefox和Chrome中完美运行。但是，在IE中，ajax调用不会通过，并且Return False函数也不起作用（一旦ajax调用失败）。 下面是我的代码： 当我尝试从ajax网址中删除http：//时，返回false确实有效。 任何帮助，将不胜感激。谢谢 问
-
问题内容： 我已经尝试过两种方法。 方式1 方式二 这两种工作方式上的镀铬细，但由于某种原因与IE不发送数据的，或根本。 我已经在本地服务器和实时Web服务器上进行了尝试，两者都得到了相同的结果。 在这里使用IE10。 问题答案： ~~~~ 应该 您将变量的值作为键传递，因此，如果您的服务器端资源期望它实际上看到了该变量的值。 这可能不是IE10问题，这不应该像在任何浏览器中一样起作用。 更新资料
-
问题内容： 我正在使用jQuery Mobile构建移动Web应用程序，但是我遇到了问题。我正在使用jQuery解析XML文件并创建列表项。它会构建列表，然后将该的列表附加到页面上的。我读到，为了使列表具有正确的样式，必须在添加数据以刷新列表后调用，以便jQuery Mobile可以为列表设置正确的样式。 我的问题是列表永远不会刷新。它一直在样式不正确。难道我做错了什么？我的代码正确吗？仅供参考，