Question

$("div#buttonContainer ul li").live("click",function(){    
    if($(this).hasClass('selected')){
        alert('selected');
    }    
});

<div id="buttonContainer">
    <ul>
        <li class="selected"></li>
        <li></li>
        <li></li>
    </ul>    
</div>

我有适用于所有li标签的click处理程序，但是我想要在li具有所选类时执行特定功能。上面的javascript弹出任何li点击的警报。我不确定我做错了什么，也许我没有正确定位特定的li。

编辑：

我必须使用jquery 1.3技术，因为我无法升级。

Answer 1

正如其他海报所回应的那样简单的案例正在jsFiddle中工作，我将假设在你的实际应用程序中有些东西改变了这个上下文。所以这个解决方案将从图片中删除这个并使用live的目标，这样它仍然可以在jQuery 1.3中使用

$("#buttonContainer ul li").live("click",function(e){
  if($(e.target).hasClass('selected')){
    console.log('selected');
  }
  console.log('any li');
});

Answer 2

工作正常。但是不推荐使用on() ... live()。

Live Example

$(function() {
    $("div#buttonContainer ul").on("click", "li", function() {
        if ($(this).hasClass('selected')) {
            alert('selected');
        }
    });
});

Answer 3

我已切换到使用on()，因为{j} 1.7正式弃用live()，其中说：

$("#buttonContainer ul li").on("click", function(e) {
    var target = $(e.target);
    if (target.hasClass('selected')) {
        alert('selected');
    }
});

JS Fiddle demo

检查按钮单击特定类

3 个答案: