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

试试这个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 2

您已使用列表ID [#fileMenu，＃editMenu]来实现此目的。以下小提琴将帮助您解决问题。

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

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

Answer 3

使用单击元素上下文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 
        }    
    });

如何获取点击的菜单详细信息

3 个答案: