87,997
社区成员
发帖
与我相关
我的任务
分享Jquery代码错误查询
如下图所示，感觉这两句红框标注的语句没有什么太大的差异（都是li元素，且里面有span元素），可点击上面这个语句始终背景色不会变化，想向大家咨询一下这是什么原因，谢谢
<body>
<ul>
<li>list f <span>item 1</span></li>
<li><span>list item 2</span></li>
<li>list it em <span>find a</span></li>
<li>list item 3</li>
</ul>
<script>
$("ul").click(function(event) {
var $target = $(event.target);
if ( $target.is("li") ) {
$target.css("background-color", "red");
}
});
</script>
<body>
<ul>
<li>list f <span>item 1</span></li>
<li><span>list item 2</span></li>
<li>list it em <span>find a</span></li>
<li>list item 3</li>
</ul>
<script>
$("ul").click(function(event) {
var $target = $(event.target);
if ( $target.is("li") ) {
$target.css("background-color", "red");
}
});
</script>
...全文
请发表友善的回复…
发表回复
lyw2073327 2021-04-14
- 打赏
- 举报
了解了，多谢啦
泡泡鱼_ 2021-04-13
- 打赏
- 举报
区别在哪里你红框已经框得很清楚了。
前2个不是点的没反应，是你click的时候，目标并不是直接在li上，是在span上
你试下第一个往文字list上面点，第二个，你得往最右边的边缘去点（就这还不一定点得到，有时候可能会受样式影响，这个你永远点不到。比如span的宽大于等于li的宽时）
