Question

如果使用制表符聚焦或使用CSS点击鼠标，我们如何更改无序列表项颜色？

编辑：查看JSFiddle

Answer 1

我不知道是否有可能使用焦点列表项，因为我认为它不是专注于焦点。您可以做的一件事是在鼠标悬停时更改颜色：

li:hover { color: #F00; background-color: #0F0; }

Answer 2

   .form li input:focus
{
    background-color:yellow;
}

检查......

如果您感兴趣，这个jQuery可能会有效，请有人介入并纠正错误！

$(".form li input").click(function(){
        $(this).closest("li").css("background-color","yellow");
});

$(".form li input").blur(function(){
        $(this).closest("li").css("background-color","white");
});

Answer 3

如果是这样尝试使用发光标签..这是更新悬停标签的最新和最快的技术.. IT将采取立场作为参数。在悬停事件。

Answer 4

这是您的纯CSS解决方案http://jsfiddle.net/Starx/a93Rb/，目前仅与FF兼容。您可以使其与其余浏览器兼容。

Answer 5

$( document ).ready(function()
{
// catch a click on any of the <li> items
$('li').click(function(){
// store a reference to the specific <li> that
// was clicked.
var $li = $(this);

// toggle the class (if it's applied, it's removed.
// if it's removed, re-apply it)
$li.toggleClass('highlight');

// Remove below code so that on click the highlight will be fixed
// Now, if it's applied, remove the class from any
// other <li> (single item clicked at a time)
if ($li.hasClass('highlight')){
    $li.siblings().removeClass('highlight');
}
});
});

在焦点上更改无序列表项的颜色？

5 个答案: