jquery在分層菜單中選擇li元素

Question

我需要能夠在點擊時從特定的li獲取文本，代碼如下：

<div>
<ul>
    <li>list item 1</li>
    <li>list item 2</li>
    <li>
      <ul>
       <li>list item 3</li>
       <li>list item 4</li>
       <li>list item 5</li>
     </ul>
    </li>
    <li>list item 6</li>
    <li>
       <ul>
       <li>list item 7</li>
       <li>list item 8</li>
       <li>list item 9t</li>
     </ul>
    </li>
  </ul>
</div>

在這種情況下，我需要通過其索引獲取“ 列表項5 ”。

編輯：

基本上，當點擊<li>list item 5</li> ，我想獲得這個particallar文本或值，當點擊其他東西時 - 什么都不做。 請注意，雖然菜單是分層的，但第5個元素表示第5個元素。 仔細檢查li項目的文本以了解。

Answer 1

$('li').on('click',function(){
    alert($(this).text());
});

工作實例

Answer 2

好吧，看來eq選擇器足以滿足您的需要。

$("li:eq(5)").click(function(){
  var text = $(this).text();
})

Answer 3

你最好的解決方案是給這個項目一個id，或者至少是一個類，然后你可以做：

$("#myID").click(function() {
    var text=$(this).text();
});

如果你不能這樣做，那么你可以嘗試使用各種導航選擇器，可能像（未經測試）：

$("div>ul>li:nth-child(3)>ul>li:nth-child(3)").click(...

但這是一個非常尷尬的方法，可能會打破你在列表中添加更多項目的第二個方法。 （這是一個小提琴 - 只有在點擊你的列表項目5時它才會發出警報）

或者如果文本是靜態的，您可以選擇：

$("li:contains('list item 5')").click(...

如果該文本發生更改，或者其他節點包含相同的文本，則會再次中斷。

Answer 4

$('ul').on('click', 'li', function() {
  console.log($(this).text());
});