如何获得点击菜单细节

Question

我有jQuery的菜单一样

<ul id="fileMenu"> 
    <li>Refresh</li> 
    <li>-</li> 
    <li>Exit</li> 
</ul> 
<ul id="editMenu"> 
    <li>Add</li> 
    <li>Edit</li> 
    <li>Delete</li> 
</ul> 

我得到的方式来获得点击事件的子菜单项像

$('#fileMenu').on('click', 'li', function() { 
      alert("Hello"); // Or make($(this)); if you still want that extra function 
     }); 

但是，如何找出特定菜单选项，即用户点击打开，退出，编辑，删除等...

Answer 1

使用单击元素上下文this创建jQuery选择器以及.text()以获取其中的文本。

您还需要添加其他家长UL选择（如#editMenu）来定位自己的元素以及 ：

$('#fileMenu,#editMenu').on('click', 'li', function() { 
     var currenttext=$(this).text(); 
     alert(currenttext); 
     if(currenttext=="Add"){ 
      //perform Add 
     }else if(currenttext=="Delete"){ 
      //perform delete 
     }else{ 
      //perform edit 
     }  
    }); 

Answer 2

试试这个Fiddle

$('#fileMenu').on('click', 'li', function() { 
 
      var text=$(this).text() 
 
    alert("Hello you clicked" + " " + text); // Or make($(this)); if you still want that extra function 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<ul id="fileMenu"> 
 
    <li>Refresh</li> 
 
    <li>-</li> 
 
    <li>Exit</li> 
 
</ul> 
 
<ul id="editMenu"> 
 
    <li>Add</li> 
 
    <li>Edit</li> 
 
    <li>Delete</li> 
 
</ul>

Answer 3

你使用列表ID [#fileMenu，#editMenu]来实现这一点。小提琴会帮助你把它整理出来。

小提琴：http://jsfiddle.net/8bv9h3um/

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