Question

让我们说我有一个复选框（a，b，c），如果选中了一个复选框（例如b），则将其副本附加到“ x”类中，问题是“如何删除（ b）在初始复选框上取消选中？”。目前，我将删除所有创建的元素，因为我不知道其他解决方案。 https://jsfiddle.net/qnsgbyra/12/

$("input:checkbox").on("change", function() {
  if ($(this).prop('checked') == true) {
    $element = $(this).parent().clone().appendTo("body").addClass("new");
    $(".new input").remove();
  }
  if ($(this).prop('checked') == false) {
    $(".new").remove();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="users">
  <label><input type="checkbox" name="1"><img draggable="false" src="https://via.placeholder.com/50x50" alt="1"></label>
</div>
<div class="users">
  <label><input type="checkbox" name="2"><img draggable="false" src="https://via.placeholder.com/60x60" alt="2"></label>
</div>
<div class="users">
  <label><input type="checkbox" name="3"><img draggable="false" src="https://via.placeholder.com/70x70" alt="1"></label>
</div>

Answer 1

添加元素时，只需在新添加的元素上创建一个唯一的类，然后取消选中此复选框即可使用新类删除该元素。

在这个答案中，我使用输入复选框名称创建唯一类。因此新课程是“新” + Checkbox_name

	$("input:checkbox").on("change", function() {
		 if ($(this).prop('checked')==true){ 
			$element = $(this).parent().clone().appendTo("body").addClass("new"+$(this).attr('name'));
      $(".new"+$(this).attr('name')+" input").remove();
		}
		 if ($(this).prop('checked')==false){ 
			$(".new"+$(this).attr('name')).remove();
		}
	});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="users">
<label><input type="checkbox" name="1"><img draggable="false" src="https://via.placeholder.com/50x50" alt="1"></label>
</div>
<div class="users">
<label><input type="checkbox" name="2"><img draggable="false" src="https://via.placeholder.com/60x60" alt="2"></label>
</div>
<div class="users">
<label><input type="checkbox" name="3"><img draggable="false" src="https://via.placeholder.com/70x70" alt="1"></label>
</div>

Answer 2

您可以根据VLCAdapter来源删除元素：

img

var src;

$("input:checkbox").on("change", function() {
  if ($(this).prop('checked') == true) {
    $(this).parent().clone().appendTo("body").addClass("new");
    $(".new input").remove();
  } else {
    src = $(this).parent().find('img:first').prop('src');
    $(".new").find('[src="' + src + '"]').remove();
  }
});

删除特定的附加元素

2 个答案: