待办事项列表复选框编号逻辑

todo list checkbox numbering logic

本文关键字:编号 复选框 列表      更新时间:2023-09-26

我想创建一个包含添加和标记为已完成功能的待办事项列表。li项目必须是唯一的,因为我使用了label for each checkbox on each li

然后我使用 $('ul li').length + 1; 为 ID 设置他们的标签。 因此每个复选框都是唯一的。

问题是我在选中复选框时使用了remove()。 它破坏了编号。 例如I have 1,2,3 and I checked 1,2 then I add a new item,该项目将具有 ID 3,这是一个冲突。有什么解决办法吗?

不要依赖他们的计数来获取唯一的 ID。下面是一个函数,每次调用时都会返回一个唯一的 ID:

function getUid(prefix) {
  return prefix + '_' +  getUid.count++;
}
getUid.count = 0;

console.log(getUid('checkbox')); // checkbox_0
console.log(getUid('checkbox')); // checkbox_1
console.log(getUid('checkbox')); // checkbox_2
console.log(getUid('checkbox')); // checkbox_3
console.log(getUid('li')); // li_4

真正安全的解决方案(私有变量):

var getUid = function() {
  var count = 0;
  return function(prefix) {
    return prefix + '_' +  count++;
  };
}();

假设您在所有复选框标签上都有某个类,为什么不直接使用 parseInt($('.label-class').last().text()) + 1 ?虽然我同意其他海报的观点,但这可能不是一个干净、通用的解决方案......从它的声音来看,它可能已经足够好了。

如果您没有得到所需的答案,请尝试为问题添加更多详细信息。不清楚你在问什么。