无法阻止列表分隔符被视为列表项

Question

$(document).on("click", "li", function() {alert("A list item was clicked");} 

我正在使用上面的代码对每个列表项执行操作,但列表分隔符也正在执行此事件.

我设法将我的关闭按钮排除在外

$(document).on("click", "li", function() {
    if (this.id !== "closeButton") {
        alert("A list item was clicked");
    }
});

但是我不能阻止它出现在列表分隔符上.我试着无济于事

$(document).on("click", "li", function() {
    if (this.class !== "ui-li-divider") {
        alert("A list item was clicked");
    }
});

这是一个有问题的JSFiddle:http://jsfiddle.net/2g3w5/

Answer 1

将选择器修改为 li:not([data-role='list-divider'])

$(document).on("click", "li:not([data-role='list-divider'])", function() {
    if (this.id !== "closeButton") {
        alert("A list item was clicked");
        //choosePageTypeToBuild();
   }
});

演示

或修改您的选择器li:not([data-role='list-divider'], #closeButton)并摆脱if条件

$(document).on("click", "li:not([data-role='list-divider'], #closeButton)", function() {
    alert("A list item was clicked"); //Get rid of if condition
});

演示

此外,请确保使用特定选择器,否则您使用的选择器将定位li文档中的所有元素.

因此id,为包装元素指定一个并相应地修改您的选择器.