Jquery 使用第n个子项根据元素位置更改变量值

我需要能够使用

.index（）

创建一个变量来标识

li

的位置，然后根据每个

li

的变量号为其赋值

这听起来可能有点混乱，所以我写了一篇文章来更好地解释这一切。共有3个

li

s，当我单击一个按钮/链接时，我需要使用

position:absolute

将它们根据其

：第n个子

位置展开。然而，目前我遇到的问题是变量（

itemNumber

）是相同的，并且不会对每个

li

进行更改

这是我的密码：

<ul>
    <li>Lorem Ipsum 1</li>
    <li>Lorem Ipsum 2</li>
    <li>Lorem Ipsum 3</li>
</ul>
<a href="#">Click me</a>

我很乐意多解释一下，因为这个想法有点让人困惑。基本前提是，我需要变量

itemNumber

为每个

li

进行更改，并且可以有任意数量的

li

s.

您可以尝试此方法-

$("ul li").each(function (index,element) {
         $("ul li:nth-child(" + index + "n)").css("top", index * 30 + "px");
});

或者更好

$("ul li").each(function (index,element) {
         $(this).css("top", index * 30 + "px");
});

你可以试试这个-

$("ul li").each(function (index,element) {
         $("ul li:nth-child(" + index + "n)").css("top", index * 30 + "px");
});

或者更好

$("ul li").each(function (index,element) {
         $(this).css("top", index * 30 + "px");
});

---

改用

.eq

：

var itemNumber = $("ul li").index(); // eq is 0 based index

$("ul li").each(function (i, v) {
         $("ul li").eq(itemNumber).css("top", (itemNumber + 1) * 30 + "px");
     });

---

改用

.eq

：

var itemNumber = $("ul li").index(); // eq is 0 based index

$("ul li").each(function (i, v) {
         $("ul li").eq(itemNumber).css("top", (itemNumber + 1) * 30 + "px");
     });

---

当你点击“点击我”时会发生什么？代码只设置

itemNumber

一次，所以值总是

1

当你点击“点击我”时会发生什么？代码只设置

itemNumber

一次，所以值总是

1

这非常有效，谢谢：）我添加了（index+1），因为index（）是基于0的，第一个元素现在是1。非常感谢您的帮助：）效果很好，谢谢：）我添加了（index+1），因为index（）是基于0的，所以第一个元素现在是1。非常感谢您的帮助：）这不太有效，它只对第一个元素有效。不太清楚为什么，我用你的代码和它应该做什么（Mohammad的代码）更新了JSFIDLE。这不太管用，只对第一个元素管用。不太清楚为什么，我用您的代码更新了JSFIDLE，以及它应该做什么（Mohammad的代码-）。