jQuery Селектор только на первом уровне не работает?

Question

У меня есть простой список с подсписка

<div id="master"> 
<ul> 
    <li><div>Trigger Me!</div></li> 
    <li><div>Trigger Me!</div></li> 
    <li><div>Trigger Me!</div> 
     <ul> 
      <li><div>Do NOT trigger me</div></li> 
      <li><div>Do NOT trigger me</div></li> 
     </ul> 
    </li> 
</ul> 

Я хотел бы только, чтобы вызвать функцию только тогда, когда пользователь нажимает на элемент списка на первом уровне, но НЕ на второй. Что касается к документации и Google, фокус должен быть легким, используя «>» в селекторе:

$(document).ready(function(){ 
    $("div#master").on("click", "ul > li", function(){ 
    alert($(this).text()); 
    }); 
}); 

Но как вы можете видеть на JSFiddle http://jsfiddle.net/kQH4x/ также срабатывает спусковой механизм, при нажатии на подсписке Предметы.

Непонятная проблема с ответом на stackoverflow (см. Здесь https://stackoverflow.com/a/977891/1099519) не работает по какой-либо причине?

Благодаря

Answer 1

Он также пожары на подсписке, потому что вы не указать, какие ul она должна начинаться с. Подсчет имеет ту же структуру, поэтому также подходит для селектора.

Чтобы это исправить, добавьте основной списки родительский элемент в селекторе, так:

$(document).ready(function(){ 
    $("div#master").on("click", ">ul>li>div", function(){ 
     alert($(this).text()); 
    }); 
}); 

Fiddle: http://jsfiddle.net/kQH4x/6/

Answer 2

Попробуйте это,

• Не нужно использовать (документ). каждый раз.
• Почему «на», просто связать «нажмите» и читать, когда использовать «на» here

$(function(){ 
     $("div#master > ul>li>div").click(function(){ 
      alert($(this).text()); 
     }); 
    });