Question

这可能很简单，但我是jQuery的新手所以......在IE 8中，即使在兼容模式下，链接颜色也不会变成粉红色。现在，如果我在firefox上运行它，它就可以运行了。但这件事让我感到困惑。如果我向该功能添加警报，则在IE 8中，该链接变为粉红色，并显示消息框。有人可以解释一下这里发生了什么吗？

<%@ Page Title="Home Page" Language="C#"  AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
    <title></title>
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<style type="text/css">
a.over {color:pink;}

</style>

<script type="text/javascript">
    $(document).ready(function () {
        $("a").mouseover(function () {
            $(this).addClass("over");
            //alert("mouseOver");
        });

        $("a").mouseout(function () {
            $(this).removeClass("over");

        });
    });

</script>
</head>
<body>
    <form id="Form1" runat="server">
    <div>
    <a class="" href="#">Link</a>
    </div>

</form>
</body>
</html>

我知道我可以添加类似a：hover to my css但这只是一个我无法工作的教科书示例。

谢谢

Answer 1

我知道你可能不会问这个，但只使用:hover伪类就可以了：）

a:hover { color: pink; }

另外，请考虑使用jQ hover()方法和jQ toggleClass()方法：

$('a').hover(function() {
  $(this).toggleClass('over');
},
function() {
  $(this).toggleClass('over');
});

但我同意@Kanishka：使用正确的DOCTYPE对IE来说是必不可少的

Answer 2

尝试添加页面开头的doctype

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

更新

The doctype declaration should be the very first thing in an HTML document, before the <html> tag.

The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.

The doctype declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly.

jquery addclass

2 个答案: