<li>标签的jQuery onclick事件

Question

我有一个模板生成器,artisteer生成的以下菜单项:

<ul class="art-vmenu">

<li><a href="#" ><span class="l"></span><span class="r"></span>
        <span class="t">Home</span></a></li>    
<li><a href="#" ><span class="l"></span><span class="r"></span>
        <span class="t">Create User</span></a></li> 
<li><a href="#" class="active"><span class="l"></span><span class="r"></span>
        <span class="t">List Users</span></a></li>  
<li><a href="#"><span class="l"></span><span class="r"></span>
        <span class="t">Admin</span></a></li>   
</ul>

我想<li>用单个jQuery函数捕获onclick事件:我尝试过这个不完整的事情:

$(document).ready(function() 
{
   $('ul.art-vmenu li').click(function(e) 
   { 
    alert(this);
   });
});

我可以看到这是一个HTMLliElement,但无法弄清楚如何获取菜单文本或ID？

如何通过jQuery捕获菜单点击？

Answer 1

在这里,获取触发事件的菜单文本(似乎没有任何id):

 $(document).ready(function() 
 {
    $('ul.art-vmenu li').click(function(e) 
    { 
     alert($(this).find("span.t").text());
    });
 });

Answer 2

在你的问题中,似乎你有span选择器给每个span单独的类ul li选项,然后你有很多答案,即

$(document).ready(function()
 {
   $('ul.art-vmenu li').click(function(e) 
    { 
     alert($(this).find("span.t").text());
   });
});

但是你不需要使用ul.art-vmenu li而是可以使用直接ul使用on,如下例所示:

$(document).ready(function()
 {
  $("ul.art-vmenu").on("click","li", function(){
     alert($(this).find("span.t").text());
  });
});