代码之家 › 专栏 › 技术社区 › BenAlabaster

How can I get the index of an ancestor within another ancestor?

list jquery

BenAlabaster · 技术社区 · 15 年前

I've got a list that's got a mouseover 事件绑定:

myObject = function()
{

    this.listTemplate = $("<ul></ul>")
        .mouseover(function(event) {
          //Do mouse over stuff
        })
        .click(function(event) {
          //Do click stuff
        });

    //...more stuff
}

Later on in my code, I'm populating this list with items returned by an Ajax call, which all works swimmingly...

In the Ajax success method:

//...
$(items).each(function(item) {
    $("<li />").append("<a />").text(item.value)
   .appendTo(templateList);
});
//...

在我的 鼠标开关 事件 event.target returns the anchor as expected, but I need the index of the li 祖先(在 ul ) of the anchor I'm hovering over.

Given that the content of the 锂 could be more complex than just the anchor, does jQuery provide a simple way of finding that out?

也就是说,我徘徊在某个后代 li[0] 或 li[4] 等。。。

1 回复 | 直到 15 年前

Community CDub 8 年前

你可以使用 .index() ,像这样:

.mouseover(function(e) {
  var i = $(e.target).closest('ul').children().index($(e.target).closest('li'));
})

来自文档:

如果 索引() 对元素集合调用,并传入dom元素或jquery对象, 索引() returns an integer indicating the position of the passed element relative to the original collection.

This goes up to the <ul> , gets it's children (the <li> elements), and gets the index of the <理工大学; containing the link in that collection.

Alternatively, instead of using event.target you can do it a bit more cleanly with .delegate() ,像这样:

$("&lt;ul&gt;&lt;/ul&gt;").delegate('li', 'mouseover', function() {
  var index = $(this).index();
})

在这种情况下, this 指的是 <理工大学; 所以正常 索引() call just gets it's index relative to it's siblings, if it's an option...it's a bit simpler route to take.

Last, kind of tangential to the question, you don't need to encode < 和 > , you can just have:

$("<li />").append("<a />").text(item.value)

If you're doing this for XHTML/validation purposes, just wrap your script in CDATA to validate correctly .

推荐文章

Dave · 如何在for循环中修改列表值

4 月前

geoscience123 · 如何计算R中一个表列与另一个数据帧的匹配数?

5 月前

matteo panaro · 向列表中添加项目

6 月前

Bioinfotec · 如何在R中将两个嵌套列表合并为一个列表?

6 月前

Jeffrey Van Laethem · 获取两个列表之间的所有元组排列

6 月前

Pernoctador · Python映射可以复制吗?我需要参考地图

6 月前

Bogaso · 从列表中返回与模式匹配的元素

6 月前

Daniel · 我有一组要排除的单词,我想检查输入的每个新单词是否完全包含在另一个单词中。我该怎么做?

6 月前

Tom Hunter · Excel验证列表中的条目

6 月前

Estrobelai · Python:数组中价格高于平均值的所有项目

10 月前