javascript - 是否可以在不包括 Jquery 中的嵌套元素的元素上注册点击？

Question

我有以下 HTML:

 <div data-role="page" id="some">               
    <p>Hello world</p>
    <div data-role="panel" id="panel">
      <p>I'm a panel</p>
    </div>
 </div>

如果用户点击页面，我需要触发一个函数，但如果他点击面板则不需要。

这是否可能 = 在不包括某些子元素的元素上注册点击？我目前正在尝试这样，但它似乎不起作用:

 $('div:jqmData(role="page"):not(#panel)').live('click tap', function(event) {
    console.log("registered a click");
    // fire a function
    });

Answer 1

匹配event.target针对选择器的对象。
使用 .parentsUntil(<elementTostopAt>, <selector>) 向上遍历树，以确保我们没有点击禁止元素的子元素。要包含单击的元素，请使用 .andSelf() .

前面描述的方法返回一个 jQuery 元素集合。使用 .length 检查此属性的大小.如果大小不为零，return .

$('div:jqmData(role="page")').live('click tap', function(event) {
    if ($(event.target).parentsUntil(this, '#panel').andSelf().length) return;
    console.log("registered a click");
    // fire a function
});