Question

我想制作一个可以使用复选框的过滤器。当选中该复选框时，它应该显示一些元素，当它不存在时，它应该隐藏它。

这是我到目前为止所获得的代码，但我无法让它正常工作。谁可以帮助我？

html隐藏/显示什么

<li class="verwijder" class="kleding"><img class="aanbieding" src="images/jack.png"><span id="timer"></span></li>

复选框

<input id="checkboxeten" type="checkbox" name="filter" value="eten"><br>

的Javascript

 $(document).ready(function(){
  if (document.getElementById("checkboxeten").checked = true) {
        $( ".kleding" ).show();
    } else {
        $( ".kleding" ).hide();
    }
 });

Answer 1

您需要一个

的事件处理程序

$('#checkboxeten').on('change', function() {
    $(".kleding").toggle(this.checked);
});

而且你不能拥有更多的一个类属性

<li class="verwijder kleding">

Answer 2

您需要使用== not =。

进行比较

应该是：

if (document.getElementById("checkboxeten").checked == true) {

或者：

if (document.getElementById("checkboxeten").checked) {

=用于分配。 ==用于比较。

此外，您还需要一个onchange事件处理程序，用于复选框。你应该不仅在页面加载时激活这个逻辑，而且当我更改复选框时我也会这样做。或点击按钮或某种事件。

Answer 3

将<li class="verwijder" class="kleding">替换为<li class="verwijder kleding">
使用我更新的jquery代码。
以下是工作示例（http://jsfiddle.net/yqkLpn6s/2/）FIDDLE

复选框结合javascript

3 个答案: