基于复选框值的jQuery Show-Hide DIV [英] jQuery Show-Hide DIV based on Checkbox Value

问题描述

使用 AJAX，我用一堆复选框(每个都有自己的唯一 ID)填充 DIV.ID 是projectID1"、projectID2"、projectID3"等等......我给所有的复选框都指定了一个pChk"类.

Using AJAX I populate a DIV with a bunch of checkboxes (each with it's own unique ID). The IDs are "projectID1", "projectID2", "projectID3" and so on... I have given all checkboxes a class of "pChk".

我的最终目标是在选中任何复选框时显示包含提交按钮的 DIV.唯一一次隐藏包含提交按钮的 DIV 是在所有复选框都未选中的情况下.

My end goal is to show the DIV containing the Submit Button if ANY of the checkboxes are checked. The only time the DIV containing the Submit Button show be hidden is if all checkboxes are unchecked.

但是，我在下面提出的代码显示/隐藏了每个复选框实例的提交按钮 DIV.换句话说，如果我选中了三个复选框，然后取消选中其中一个，则提交按钮 DIV 将被隐藏.

However the code I have come up with below shows/hides the Submit Button DIV for each checkbox instance. In other words, if I have three checkboxes CHECKED and I UNCHECK one of them, the Submit Button DIV get hidden.

非常欢迎您的专家建议！

Your expert advice is more than welcome!

function checkUncheck() { 
    $('.pChk').click(function() {
        if (this.checked) {
            $("#ProjectListButton").show();
        } else {
            $("#ProjectListButton").hide();
        }
    }); 
}

推荐答案

如果有人再次遇到这个问题(通过搜索)，这已经过时了.jQuery 1.7 以后的正确答案是:

While this is old if someone comes across this again (via search). The correct answer with jQuery 1.7 onwards is now:

$('.pChk').click(function() {
    if( $(this).is(':checked')) {
        $("#ProjectListButton").show();
    } else {
        $("#ProjectListButton").hide();
    }
}); 

这篇关于基于复选框值的jQuery Show-Hide DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！