取消选中复选框时,.remove()不起作用

时间:2017-05-16 22:20:46

标签: javascript php jquery html checkbox

我在尝试检查和取消选中复选框时遇到了一些问题。当我检查它时,它显示以下图片: here

应显示按钮,删除,重命名和共享,附加到上传和新文件夹。但是在取消选中后我无法删除追加。

我的代码如下:(jQuery)

var ids = <?php echo json_encode($arr); ?>;
for(i = 0; i < ids.length; i++) {               
                var sel = $("input[id='" + ids[i] + "']");
                $(sel).on('click', function(e) {
                    e.stopPropagation();
                    $.each(sel, function( sel ) {
                        if($(sel).is(':checked')) {
                            $("#del").remove();
                            $("#rename").remove();
                            $("#sharing").remove();
                            $(sel).prop('checked', false );
                        } else {
                            $(sel).prop('checked', true );
                            $("#del").remove();
                            $("#rename").remove();
                            $("#sharing").remove();
                            $(".sub-menu-files ul").append("<li class=\"delbtn\"><button id=\"del\">Delete File</button</li> <li class=\"renamebtn\"><button id=\"rename\">Rename</button></li> <li class=\"sharingbtn\"><button id=\"sharing\">Sharing</button></li>");
                            $("#del").click(function() {
                                var sels = $("tbody tr input");

                                $(sels).each(function() {
                                    if($(this).is(':checked')) {
                                        alert($(this).attr('id') + " has been deleted");
                                        $.post("delete.php", {id: $(this).attr('id') }, function(data) {
                                            if(data != "") {
                                                alert("Your file/files have been sent to the Trash. To delete them from our server, go to \"Deleted Files\" and delete it.");
                                            }
                                        });
                                    }
                                });
                            });
                        }
                    });
                });


            }           

ids将向数据库挑选上传文件的ID。我尝试了一切,但没有好处。

我的php + HTML内容是:

<td><input type="checkbox" name="select" class="case" id="<?php echo $rows['id']; ?>" style="cursor: pointer;" /></td>

也在挑选身份。

无论如何我能使它发挥作用吗?

3 个答案:

答案 0 :(得分:0)

它不起作用,因为当脚本第一次运行时,这些元素还不存在。

因此,你应该通过一直存在的元素来引用它们,身体是好的。

$('body').find('#del').remove();

这应该有效

答案 1 :(得分:0)

试一试。你甚至不需要嵌入式PHP部分。它真的是两个处理程序。

&#13;
&#13;
//handler for #del.  you only need to declare this once, as a global.
$(document).on("click", "#del", function() {
  var sels = $("tbody tr input:checked");

  $(sels).each(function() {

    alert($(this).attr('id') + " has been deleted");
    $.post("delete.php", {
      id: $(this).attr('id')
    }, function(data) {
      if (data != "") {
        alert("Your file/files have been sent to the Trash." +
          " To delete them from our server, go to \"Deleted Files\" and delete it.");
      }
    });

  });
});

//handler for check boxes
$(document).on("change", "tbody tr input", function(e) {
  //See if any are checked.
  if ($("tbody tr input:checked").length > 0) {
    {
      $(".sub-menu-files ul").append("<li class=\"delbtn\"><button id=\"del\">Delete File" +
        "</button</li> <li class=\"renamebtn\"><button id=\"rename\">" +
        "Rename</button></li> <li class=\"sharingbtn\">" + " <
        button id = \"sharing\">Sharing</button></li>");
    } else {
      $("#del, #rename, #sharing").remove();
    }
  };
});
&#13;
&#13;
&#13;

答案 2 :(得分:0)

我发现了错误。它只是将$(sel).on('click', function() {函数更改为$.each(sel, function(sel) {函数内部,并从 转换 sel on('click') this

每个试图帮助我的人我都想欣赏它。