项目如何消失并显示在选择/取消选中复选框?

时间:2012-07-10 06:41:00

标签: php jquery css

如何在复选框上的点击事件中使用jquery隐藏/显示网页上的项目(假设有多个复选框,每个复选框都有相关项目)?

1 个答案:

答案 0 :(得分:2)

页面中的一些javascript代码等待页面加载,然后在复选框上注册click事件,当复选框的值更改时,代码查看当前值,然后隐藏/显示其他项目网页。

在某些情况下,它甚至可能会对服务器进行ajax调用以获取新内容,然后将该内容插入到页面中。

在jQuery中,你可以这样做:

$(document).ready(function() {
    $("#showRelatedItems").click(function() {
        $(".relatedItems").toggle($(this).prop("checked"));
    });
});

这适用于包含id="showRelatedItems的复选框和包含class="relatedItems"的一组相关项。

工作演示:http://jsfiddle.net/jfriend00/egYJj/