我对Javascript很陌生,并且不知道从哪里开始。我有一个复选框列表。我想要在选中复选框时实现,复选框将从列表中删除。我找到了一些不同的解决方案,但它们都有一个按钮,您需要按下才能删除复选框,我只想在复选框中删除该复选框。
这就是我的HTML的样子:
<ul class="list-group">
<li class="list-group-item">
<div class="checkbox">
<label>
<input type="checkbox"> Item 1
</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label>
<input type="checkbox"> Item 2
</label>
</div>
</li>
</ul>
答案 0 :(得分:1)
根据您需要的精确程度,这里有一个在点击时删除父LI的
如果您只想在选中时删除
,则可以添加if (this.checked) { ... }
$(function() {
$("input[type=checkbox]").on("click",function() {
$(this).closest("li").remove(); // $(this).remove(); to remove the checkbox only
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<ul class="list-group">
<li class="list-group-item">
<div class="checkbox">
<label><input type="checkbox"> Item 1</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label><input type="checkbox"> Item 2</label>
</div>
</li>
</ul>
答案 1 :(得分:0)
请参阅此代码,这是在点击checkbo时删除当前复选框
代码
$( '.checkbox input[type="checkbox"]' ).change( function(){
$(this).remove();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="list-group">
<li class="list-group-item">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox">
</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox">
</label>
</div>
</li>
</ul>