Функции Jquery в неупорядоченном списке

Question

У меня есть элементы списка в неупорядоченном списке, которые вызывают функции через события jquery click. Проблема заключается в том, что li вызывает свою функцию, а затем вызывает родительскую функцию ul. Я просто хочу, чтобы функция вызывала, что я ссылаюсь на идентификатор. Это проблема родительского ребенка?

<ul id="mainlist"> 
    <li id="item1">list1</li> 
    <li id="item2">list2</li> 
</ul> 

Jquery

$("#mainlist").click(function { 
    someFunction(); 
    }); 
$("#item1").click(function { 
    someOtherFunction(); 
}); 

Answer 1

Вы просто должны остановить событие от распространяющихся своих предков:

$("#item1").click(function (event) { 
    event.stopPropagation(); 
    someOtherFunction(); 
}); 

Или, вы можете проверить щелкнул элемент (event.target), чтобы увидеть, если это <ul> или <li>, проверив его id:

$("#mainlist").click(function (event) { 
    switch (event.target.id) { 
     case 'mainlist': 
      someFunction(); 
      break; 
     case 'item1': 
      someOtherFunction(); 
      break; 
     default: 
      break; 
    } 
}); 

Ссылки:

• JavaScript:
  • Event.stopPropagation().
• JQuery:
  • Event.stopPropagation().