JQuery：将 .last() 与 .on 中创建的元素一起使用

Question

我目前正在制作类似于 Google Chrome 的选项卡结构。我最近制作了一个 "New Tab" 按钮和添加新选项卡的功能。现在我的函数只创建 one 选项卡。我的代码库使用 $(".tab-clickable").last().after() 将下一个选项卡元素放入 HTML 树中。最后一个 .tab-clickable 元素表示最近选项卡的最后一部分。

这是我的代码：https://codepen.io/lectrician1/pen/baOxdO

我最初使用的是 .click 事件，但后来切换到 .on，因为我认为查找上次创建的选项卡时出现问题。所以我运行进行了调试测试，显然 .on 不是问题，但 $(".tab-clickable").last().after() 才是。 但请记住，我的代码仍会创建一个选项卡，但只有一个。 我认为这个问题必须处理找到刚刚在第一个选项卡中创建的最后一个 .tab-clickable 元素。

Answer 1

请post您下次提问问题中代码的相关部分，或编辑您的post。

您正在使用最初设置为 2 的 tabAmount 变量确定新选项卡的位置。但是，当您添加新选项卡时，您绝不会增加此变量。您的代码正在生成新的选项卡，但它们只是彼此放在同一个位置。

解决该问题所需要做的就是将 tabAmount++ 添加到函数的末尾（如果删除标签，则将其递减，或者每次都从长度中取值）

Answer 2

主要问题是您只在页面加载时检查 tabAmount。每次要添加另一个时都需要检查它以获得更新计数

移动：

var tabAmount = $(".tab-clickable").length;

进入

$("#button").on("click", function() {
   var tabAmount = $(".tab-clickable").length;
   // other code remains same

JQuery：将 .last() 与 .on 中创建的元素一起使用

JQuery: Using .last() with a created element in a .on

javascript

jquery

events

tabs

google-chrome-app