使用JQuery如何检测某个列表的任何html列表元素上的点击，并获取li元素中的文本？

Question

使用JQuery如何检测某个列表中任何html列表元素的点击，并获取li元素中的文本？

例如，我有以下列表：

<ul id="mylist">
  <li>one</li>
  <li>two</li>
  <li>three</li>        
</ul>

例如，如果用户点击li元素一个，那么JQuery应该检测到这个并且还获取字符串“one”。

我自己尝试解决问题

我正在考虑给每个li元素一个开头相同的id，例如：

<li id='li-1'>one</li>
<li id='li-2'>two</li>
<li id='li-3'>three</li>

然后执行以下操作（CoffeScript）：

$('[id^="li-"]').click ->
  console.log $(this).html # should log one when user clicks on li-1 etc 

但这看起来真的不那么优雅和凌乱。请有人帮助我，并教我一个更好的方法来做这个（和一个有效的，因为我的例子不起作用:(）

Answer 1

这会有用吗？ （使用demo）

$('#mylist li').on('click', function() {
    console.log($(this).html());
});

此处事件附加到li内的所有ul元素作为“mylist”的ID，因此这不会触发您dom中的任何其他li。由于事件监听器直接附加到li，因此调用$(this)会为您提供该元素。

或者在CoffeeScript（以及demo）

中

$('#mylist li').click ->
  console.log $(this).html()
  false