Question

我有一个<ul>，每个<li>的背景为50px * 50px，但我想知道我从ul中点击了哪个<li>，第一个，第二个，第三个。< / p>

每个<li>都有一个图片，因此，当我点击<li>时，图片会显示在另一个<div>中，但是当我想要更改图片时，我想知道哪个是点击一下。

$("#ul element").on("click", "li", (function() {
    $("#thediv").hide();
    $("#thediv").empty().append('<li>' + this.innerHTML + '</li>');
    $("#thediv").fadeIn("slow");
    })
);

所以当我点击一个li时，图像会转到div，但我想知道哪个索引有li。（1,2,3,4,5等）。

Answer 1

this应该告诉您点击了哪个“li”。

Answer 2

在.on()内，您可以拨打$(this)，这将选择与父.on()功能对应的元素。

例如：

$("li").click(function(){

    $(this).css("background", "blue");

});

JSFiddle

Answer 3

您可以使用以下内容获取列表中的当前索引

$( this ).index();

Answer 4

jQuery通过e.target传递任何事件的实际目标元素，所以你可以这样做：

$("#ul element").on("click", "li", function(e){
  var $target = $(e.target);
  var index = $target.index();

  ...
  // Assuming you do things with the target here.
});

<强>小提琴

http://jsfiddle.net/marionebl/472VT/

Answer 5

获取索引的最简单方法是简单地为li分配id值，如下所示：

<ul id="indexedList">
<li id="1">1st Index</li>
<li id="2">2nd Index</li>
<li id="3">3rd Index</li>
</ul>

然后通过调用attr（）函数简单地获取id：

$("li").click(function(){

    alert($(this).attr("id"));

});

这是JSFiddle：http://jsfiddle.net/YWP2p/1/

我如何知道从<ul>？</ul> </li>中点击了哪个<li>元素

5 个答案:

JSFiddle