Javascript 如何重用此功能？

我已经编写了一个功能，它工作得很好，但是当我尝试在同一个类的多个html块上重用它时，它会崩溃。我尝试过使用

.next（）

和

.neast（）

方法，但没有结果。我在哪里应用这些？该功能是使用无序列表重新创建一个

下拉列表

重要的是，类和函数与CMS生成的列表保持一致，并且可以在一个页面上重复多次，因此有一个解决方案，在其中我更改代码并单独调用每个函数是不好的

演示

（函数在一个无序列表上正常工作）

---

（在重用函数和html代码时）

您的脚本有许多地方需要更改，尽我所能理解你想做什么

要点是：

$(".cloned").click(function(){
    $('.options').toggle();
    e.preventDefault();                 
});

处理程序中的

$（'.options'）

选择器选择带有

options

类的所有元素，而不管您在文档中单击的位置如何。这就是为什么每次点击都会激活下拉列表

您应该只为单击选择特定的

.options

元素。有很多方法可以做到这一点，但我就是这么做的：

$(this).next('.options').toggle();

---

您的脚本中有许多内容需要更改，尽我所能理解你想做什么

要点是：

$(".cloned").click(function(){
    $('.options').toggle();
    e.preventDefault();                 
});

处理程序中的

$（'.options'）

选择器选择带有

options

类的所有元素，而不管您在文档中单击的位置如何。这就是为什么每次点击都会激活下拉列表

您应该只为单击选择特定的

.options

元素。有很多方法可以做到这一点，但我就是这么做的：

$(this).next('.options').toggle();

---

这可能更好。。看看这把小提琴

使用

toggleClass（）

---

这可能会更好。。看看这把小提琴

使用

toggleClass（）

---

嗨，Richard，谢谢你的明确回答和解决方案。我试着用这个来制作一个无序的列表，作为一个。当您在列表中选择一个列表元素时，将弹出下一个列表。。第一个工作演示基本上是它是什么，但它是重复使用多次在同一页上。希望这是有意义的。嗨，理查德，谢谢你的明确回答和解决方案。我试着用这个来制作一个无序的列表，作为一个。当您在列表中选择一个列表元素时，将弹出下一个列表。。第一个工作演示基本上是它是什么，但它是重复使用多次在同一页上。希望这有意义。我想您需要更改

$（“.options”）.toggle（）

到

$（this）.next（“.options”）.toggle（）我想您需要更改
$（“.options”）.toggle（）
到
$（this）.next（“.options”）.toggle（）哦，太好了，这节省了很多代码，甚至没有开始比较我写的东西的逻辑。谢谢偶然发现一个使用此。。当我选择一个列表项并再次单击“下拉列表”时，列表顺序将再次默认，并显示第一个项目。。有什么方法可以防止这种情况发生吗？所以当用户单击列表中最后一个选中的项目时，您希望它再次位于列表的第一位？是的，使用append方法可以做到这一点吗？我在空范围内使用.clone（）方法编写的函数中完成了这一操作，但不确定这是否是最佳解决方案？哦，太好了，这节省了大量代码，甚至没有开始比较我写的东西的逻辑。谢谢偶然发现一个使用此。。当我选择一个列表项并再次单击“下拉列表”时，列表顺序将再次默认，并显示第一个项目。。有什么方法可以防止这种情况发生吗？所以当用户单击列表中最后一个选定的项目时，您希望它再次位于列表的第一位？是的，使用append方法可以做到这一点吗？我在空范围内使用.clone（）方法编写的函数中完成了这一操作，但不确定这是否是最佳解决方案？