Question

是否有可能用jquery来说如果我点击列表元素会发生什么事情，但是如果我点击该列表中的元素（例如一个范围）就没有必要改变

实施例

<li><span>hello</span></li>如果我点击li element =＆gt; alert（“list”），如果我点击li =＆gt;里面的span元素alert（“hello”）butit也不必向我显示警告（“list”）。

Answer 1

是的，请检查触发事件的event.target节点。

$('li').click(function(event){
    if (event.target. == event.currentTarget)
        // li element triggered
    else
        // inner elements triggered
});

Live STUPID DEMO

Answer 2

您需要使用event.stopPropagation;

http://api.jquery.com/event.stopPropagation/

jsFiddle demo

<小时/> 如果你使用.live()方法（并且你有jQuery 1.7+），我建议你使用.on方法，如：

$('ul').on('click','li',function(){
  alert('UAAAAAAA! FOOO BARRRRR');
});

$("li").on('click','span',function(event){
  event.stopPropagation();
  $(this).text('See? No alert dropped! ;)');
});

更多信息：http://api.jquery.com/on

.on（）方法将事件处理程序附加到jQuery对象中当前选定的元素集。从jQuery 1.7开始，.on（）方法提供了附加事件处理程序所需的所有功能。有关从旧的jQuery事件方法转换的帮助，请参阅.bind（）,. delegate（）和.live（）。要删除与.on（）绑定的事件，请参阅.off（）。要附加仅运行一次然后自行删除的事件，请参阅.one（）

Answer 3

参考 LIVE DEMO

点击Red边框及其内部 - LIST
点击Bluw边框及其内部 - HELLO

HTML：

<ul>
    <li>
        <span>hello</span>
    </li> 
</ul>

JS：

$('*').click(function() {
    if (this.tagName == "LI")
        alert("List");
    else if (this.tagName == "SPAN")
        alert("hello");
    return false;
});

使用jquery更改内部选定元素的功能？

3 个答案:

jsFiddle demo

HTML：

JS：