Question

如何在点击时更改UL'li'的背景颜色？

EDIT 我可以改变li“a”但是整个 li

呢

这有效：

 $(".clickableUL").click(function() {
           $(this).find("li a").addClass("active");

       });

但是发现（“li”）什么都不做。我希望LI不仅突出显示链接的文本。

Answer 1

// javascript
$("li>a").click(function(){
   $(this).parent().toggleClass("clicked");
});

/* CSS */
li { background: blue; }
li.clicked { background: red; }

您还可以使用display: block;上的<a>来填充<li>，除非您希望保持更改。

编辑：噢哦！刚刚意识到你也可以将点击事件直接应用到<li>本身，例如

$("li").click(function(){
   $(this).toggleClass("clicked");
});

Answer 2

您可以修改锚点的父级（假设父级是＆lt; li＆gt;元素。

$('a').click(function(evt) { 
   $(evt.target).parent().css('background-color', '#fff'); 
});

如何通过jQuery点击更改html元素<li>的颜色？</li>

2 个答案: