无法删除DOM

Question

上面的图片就是我正在做的事情。当点击任何空方格时，它应该将值附加到$("#captureAvail")和$("#captureAvail2")。同时它必须是一个使方形为绿色的类。那个班叫做'green2'。现在，当再次单击该项目或删除“green2”类时，我无法成功删除该元素。请帮帮我。以下是我的代码。当我添加这一行：$("#captureAvail").remove("<input type='hidden' name='avail[]' value='"+thisValue+"'>");时，我发现方块变得无法点击.Below是我的脚本。

$("#greeny td:not(:first-child)").on("click",function()//prevent the first column to be clickable
       {
          //alert($(this).text());
           var thisValue = $(this).text();
           //
           if($(this).hasClass('green2'))
           {
               $(this).removeClass('green2');
                $("#captureAvail").remove("<input type='hidden' name='avail[]' value='"+thisValue+"'>");
                $("#captureAvail2").remove("<input type='hidden' name='avail[]' value='"+thisValue+"'>");
           }else
           {
               $(this).addClass('green2');
                $("#captureAvail").append("<input type='hidden' name='avail[]' value='"+thisValue+"'>");
                $("#captureAvail2").append("<input type='hidden' name='avail[]' value='"+thisValue+"'>");
           }

           //$(this).toggleClass("green2");
           //

           //$("#captureAvail").css("background-color","#ff0000");
       });

Answer 1

remove函数删除了jquery选择器中匹配的元素。您需要删除其子项：

$("#captureAvail").empty();

Answer 2

remove()方法无法正常使用。它将选择器作为参数，而不是HTML字符串，尽管在您的情况下不需要它。试试这个：

$("#captureAvail").find('[value="' + thisValue + '"]').remove();
$("#captureAvail2").find('[value="' + thisValue + '"]').remove();

Answer 3

你误解了删除jQuery的功能。

https://api.jquery.com/remove/

如下所示：

$("#captureAvail input").remove('[value=' + thisValues + ']');
$("#captureAvail2 input").remove('[value=' + thisValues + ']');