Javascript jQuery-隐藏删除图标，除非添加/存在同级元素

我有一个表单，允许用户通过分别单击

+

或

-

动态添加或删除行。但是，用户不应该能够删除任何一天的第一行，因此，如果他们在所讨论的一天中至少添加了一行，那么应该只有一行

-

目前，当点击

-

图标时，我只是不响应

remove（）

，只有7行（绝对最小值）

代码如下：

具体而言，解决方案如下：

 function remove() {
   if (cloneIndex > 7) {
     $(this).closest(".actions").prev(".time-interval").remove();
     cloneIndex--;
   }
   console.log(cloneIndex);
 }

这是可行的，但我想要的行为是不在每天的第一行显示

-

图标，只有在每天添加新的/同级行时才显示它，如果删除这些新的/同级行，则再次隐藏它

---

我尝试根据count变量（

cloneIndex

）的值来显示/隐藏它，但这并不可靠，因为表单中的所有行都会全局共享计数，而不仅仅是当天的特定行。

您甚至不需要JQuery来执行此操作，只需使用CSS隐藏第一个元素上的delete按钮。其工作原理是首先选择具有

.row

类的所有列表项，将其筛选到这些行中的第一行，然后查找具有

.delete

类的子项并将其隐藏

.row:类型的第一个。删除{
显示：无；
}

第一项
- 


第二项
- 


第三项
- 


第四项
- 

正如我在评论中提到的那样，我觉得一周中的每一天都需要一位家长，因此我在标记中添加了时间间隔家长。每次添加或删除一行时，还需要重新索引

名称
元素数组，这需要向输入和选择添加一个唯一的类，以便在DOM中找到它们。这是我整理的一份报告

此函数获取select id（星期几）并将其用于名称属性。然后修改属性并添加索引

function setIndex(elements) {
    elements.each(function(index, element) {
    var day = $(element).closest(".row").find(".day").attr("id");
    $(element).find("select.from_hours").attr("name", "from_hours[" + day + "][" + index + "]");
    $(element).find("select.to_hours").attr("name", "to_hours[" + day + "][" + index + "]");
  });
}

“删除”按钮最初是隐藏的。我在您的
克隆
函数中添加了功能来显示它。最后，它将所有元素传递到
setIndex
并运行它

在
remove
函数中，删除元素后，它会再次运行
setIndex
，但如果它总是删除最后一个元素，因为索引不会更改，则无需执行此操作。它还对元素进行计数，如果只有一个元素，则隐藏“移除”按钮。希望这能让您更接近，并向您展示执行此操作所需的不同方面。
Hmm，这在我的情况下不起作用（可能是因为我正在克隆元素）。当我尝试它时，它会导致删除按钮也从所有后续/克隆的元素中消失（）。@tzazo这是因为您将
.row
元素放在其他元素中，因此从技术上讲，每一行都是“第一”行。必须在行上方较高的元素上使用选择器。如果我向父级/containing
div
添加一个类
.higher
，并将CSS调整为目标，那么我仍然无法获得所需的行为。我觉得这很接近，但我肯定错过了一些简单的东西：@tzazo正如我提到的，克隆的元素共享相同的按钮。如果以这种方式隐藏第一个，它将隐藏整个集合。我认为最好在第一个删除按钮上使用
style=“display:none；”“
，然后在克隆行时可以删除该行。或者，将“删除”按钮保留在外，然后在克隆后添加它。@EternalHour谢谢您的建议！我几乎可以让它工作了，但是，当您添加几行，然后将它们全部删除时，
-
图标可见（也就是说，我丢失了原来的
style=“display:none；”
来自HTML。你将如何解决这个问题？Fiddle：这是因为它们都共享相同的按钮。为了使它正常工作，你必须使用它们的数量，并且在只有一个按钮时总是隐藏它。在我看来，你需要一个更好的HTML结构。克隆的元素是一周中某一天的子组件，但是，它们确实是不要共享同一父容器，因此管理它们非常困难。如果它们具有相同的父容器，则可以使用
.length
轻松知道有多少克隆行。此外，克隆的表单元素与原始表单元素使用相同的name属性，因此提交表单时只会有一个元素在一周中该天的数组中。克隆它时，需要向数组添加索引，以便它们都存在。