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();
   }
});

Demo

或将您的选择器修改为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
});

Demo

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

因此，将id分配给包装器元素并相应地修改选择器。

Answer 2

对不可点击的项目使用标志类。将脚本更改为此，

这里我使用'stat'类作为标志

$(document).on("click", "li", function() {
    if(!$(this).hasClass('stat')){
        alert("A list item was clicked");
   }
});

DEMO

Answer 3

因为你的分隔符是'li'元素，修改“li” - ＆gt; “a”，看看会发生什么

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

Answer 4

您也可以检查data-role属性并发现该项目不是list-divider

示例代码将是这样的

 $(document).on("click", "li", function () {
    if ($(this).attr('data-role') !== 'list-divider' && this.id !== "closeButton") {
        alert("A list item was clicked");

    }

});

JSFiddle Demo

Answer 5

在jquery中使用:not

$(document).on("click", "li:not('.ui-li-divider')", function() {
        alert("A list item was clicked");
        //choosePageTypeToBuild();
});

或在jquery中查看hasClass

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

DEMO

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

5 个答案:

JSFiddle Demo