Question

我想在取消选中复选框后清除div的内容。此外，选中复选框时，内容应该是可见的。

我已经尝试过，但在取消选中该复选框后，它不会清除内容。它只是在检查时添加更多内容..

这是我的ajax代码。

$('.myCheck').on('ifChecked', function (event) {
    if ($(this).is(":checked")) {
    $.ajax({
        url: '/Home/getCategoryItems',
        type: "GET",
        cache: false,
        data: {
            name: $(this).attr("name")
        },
        success: function (data) {

            $("#displayCarsSection").append(data);
        }
    });

    } else {
        $("#displayCarsSection").html('');
    }
});

Answer 1

由于您希望在未选中时清除复选框特定数据，因此可以将其存储在对象中。因此，每当选中或取消选中复选框时，您都可以清除div并使用该对象生成要追加到div的新数据。

{{1}}

Answer 2

为什么不使用更改侦听器？据我所知，“点击”也应该有用。

请参阅https://jsfiddle.net/kkryao5g/1/

的JavaScript

$('.myCheck').on('change', function (event) {
    if ($(this).is(":checked")) {
      $("#displayCarsSection").append($(this).attr('id'));
    } else {
        $("#displayCarsSection").html('');
    }
});

HTML

<input type="checkbox" class="myCheck" id="myCheck1"> <label for="myCheck1">Option 1</label>
<input type="checkbox" class="myCheck" id="myCheck2"> <label for="myCheck2">Option 2</label>
<input type="checkbox" class="myCheck" id="myCheck3"> <label for="myCheck3">Option 3</label>
<br><br>
<span id="displayCarsSection"></span>

Answer 3

您只有一点点错误，您应该使用ifChanged回调代替ifChecked。

$('.myCheck').on('ifChanged', function (event) {
    if ($(this).is(":checked")) {
    $.ajax({
        url: '/Home/getCategoryItems',
        type: "GET",
        cache: false,
        data: {
            name: $(this).attr("name")
        },
        success: function (data) {

            $("#displayCarsSection").append(data);
        }
    });

    } else {
        $("#displayCarsSection").html('');
    }
});

现在，这将在每次检查/取消选中时收听

来源：http://icheck.fronteed.com/

如何使用ICheck.js清除div的内容？

3 个答案: