Javascript 撤消功能不工作

这并没有一个严格意义上的撤销按钮，但是我拥有的功能会变灰，并在单击时划掉一个项目。再次单击时，我希望灰色和交叉线恢复正常（黑色和未交叉）

我似乎不明白，代码笔让我检查分号。

$（“.item”）。单击（函数（）{
$（this.toggleClass（'grayStrike'）；
});
//或者没有课
$（“.item2”）。单击（函数（）{
if（$（this.css（'text-decoration'）.split（“”）[0]！==“行通过”）{
$（this.css（“文本装饰”、“线条通过”）；
$（this.css（“颜色”、“灰色”）；
}否则{
$（this.css（'color'，''）；
$（this.css（'text-decoration'，''）；
}
});
//委托版本，因此，如果创建了新项目，这并不重要
$（文档）.on（'单击'，“.item3”，函数（）{
if（$（this.css（'text-decoration'）.split（“”）[0]！==“行通过”）{
$（this.css（“文本装饰”、“线条通过”）；
$（this.css（“颜色”、“灰色”）；
}否则{
$（this.css（'color'，''）；
$（this.css（'text-decoration'，''）；
}
});
.item.graystike{
颜色：灰色；
文字装饰：线条贯通；
}

测试

测试1
测试2
测试3
测试4
测试5
测试6
测试7
测试8

测试1
测试2
测试3
测试4
测试5
测试6
测试7
test8
一个工作解决方案：

$(document).on("click", ".item", function() {
  if ($(this).css("text-decoration").split(" ")[0] !== "line-through") {
    $(this).css("text-decoration", "line-through");
    $(this).css("color", "gray");
  } else {
    $(this).css("color", "");
    $(this).css("text-decoration", "");
  }
});

不要这样做。不要将一个绑定嵌套在另一个绑定中。而是在顶级绑定中执行条件绑定。同时，使样式更改成为一个可以添加/删除的类也大大减少了问题的范围。您能详细说明一下吗？因此，与其将UNDO函数嵌套在要执行的函数中，不如将IF函数完全分离？在取出注释时，此代码不会正确执行。也许错过了（）{}？一个错误。。。现在试试，这仍然不起作用。只需将您的代码复制并粘贴到我的代码笔中，然后自己查看（和我lol）。括号似乎有问题，我找到了解决办法。多亏了@lekens让我到了那里。@Helle增加了更多的div。对所有人都适用。@Hellie更新了一个代理版本。如果您是动态创建元素，那么新元素上就不会有绑定。因此，您必须使用委托，以便在何时创建它们都无关紧要，并且它应该可以工作。同样，不要嵌套绑定。使用此逻辑，每次2n+1次单击，您将在元素上添加另一个不必要的单击绑定。我更新了我的答案，使之包含一个非类、非双重绑定版本。@Taplar这不起作用。单击时，它将变灰。再次单击时，什么都没有happens@taplar发布的版本的结束标记数量不正确，因此在codepen中出现错误。当更正为正确的数字时，该函数不会撤消灰色交叉并更新解决方案。@t此编辑只工作一次。如果要多次灰显和取消灰显项目，脚本将停止工作。
 $(".item").click(function() {
      $(this).css("text-decoration", "line-through");
      $(this).css("color", "gray");      
      if ($(this).css('color', 'gray')) {
      //  $(this).click(function() {
          $(this).css('color', 'black');
          $(this).css('text-decoration', 'none');
           }else{
           $(this).css('color', 'gray');
          $(this).css('text-decoration', 'line-through');}
         // })
       });

$(document).on("click", ".item", function() {
  if ($(this).css("text-decoration").split(" ")[0] !== "line-through") {
    $(this).css("text-decoration", "line-through");
    $(this).css("color", "gray");
  } else {
    $(this).css("color", "");
    $(this).css("text-decoration", "");
  }
});