0

我正在努力寻找可以说是最基本的 jquery 问题之一的答案：

我希望以下将“a”元素背景颜色更改为蓝色（我希望这是一个简单的语法问题）

[我知道这最好在 CSS 中完成，但我正在尝试学习 jquery]

HTML：

<ul>
    <li><a href="">Make</a></li>
    <li><a href="">Me</a></li>
    <li><a href="">Blue</a></li>
</ul>

CSS：

ul {
     list-style:none;
}

li {
     float:left;
}

a {
     display:block;
     text-decoration:none;
     background-color:red;
     height:40px;
     width:100px;
     margin-right:1px;
     text-align:center;
     line-height:40px;
     color:white;
}

查询：

$('a').hover(function() {
    $('a').css('background-color', 'blue');
});

jsFiddle 在这里：http: //jsfiddle.net/liquidengine/jRM2K/2/

4

2 回答 2

2

您的 jsFiddle 中没有任何内容。您只需要查看代码并尝试了解它要做什么。在您的示例中，每当 aa悬停时，您都将所有锚点的颜色设置为蓝色。那么你还没有尝试处理 mouseout 事件。尝试这样的事情：

$('a').hover(function() {
   // set background colour of the hovered anchor
   $(this).css('background-color', 'blue');
}, function() {
   // remove background colour when hovered off
   $(this).css('background-color', '');
});

我知道你说过你不想使用 CSS，因为你想学习 jQuery，但这是 CSS 的工作。如果您想学习 jQuery，请尝试构建需要 jQuery 的东西。因为你永远不应该使用 jQuery 来做到这一点。这里有一个热门提示：如果您希望使用 jQuery 更改元素的颜色（例如，单击时），至少使用类。不要使用 jQuery 设置属性。例子：

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

CSS：

a.hovered {
  background-color: blue;
  /* other styles here */
}
于 2013-05-02T11:21:29.777 回答
0

做：

$('a').hover(function() {
   $(this).css('backgroundColor', 'blue');
});

更新了 jsFiddle

于 2013-05-02T11:19:47.747 回答