根据复选框选择显示/隐藏对象 [英] show/hide object based on checkbox selection

问题描述

我有一个页面，其中包含一组复选框，每个复选框都有一个动态生成的值，因此它随每个页面的呈现而变化.示例如下:

I have a page that include a set of checkboxes, each with a value that is dynamically generated, so it changes with each page rendering. A sample looks like this:

<fieldset id="P163_PROFILES" tabindex="-1" class="checkbox_group">
   <input type="checkbox" id="P163_PROFILES_0" name="p_v01" value="264" checked="checked">
   <input type="checkbox" id="P163_PROFILES_1" name="p_v01" value="2356" checked="checked">
</fieldset>

然后

我在日历其余部分的整个页面其余部分中具有<div class="264">和<div class="2356">标记，其中DIV类与输入值相匹配.我的问题是这个.如果用户取消/选中输入框之一，我想隐藏/显示具有匹配类的DIV.由于我是jQuery的新手，所以我一直在努力寻找逻辑，以识别已更改的输入对象，然后使用其值来更改适当的DIV对象.这是我到目前为止的代码:

I then have <div class="264"> and <div class="2356"> tags throughout the rest of the page in a calendar layout where the DIV class matches on of the input values. My question is this. If a user un/checks one of the input boxes, I want to hide/show the DIVs with the matching classes. Since I'm new to jQuery, I'm struggling with the logic to identify the input object that has changed and then use it's value to alter the appropriate DIV objects. Here is the code I have thus far:

<script type="text/javascript"> 
$( '[id^=P163_PROFILES_]' ).click(function(){
   var pClass = '.'+$(this).val();
   if ($(this).is(':checked')) {
         $(pClass).show;
      } else {
         $(pClass).hide;
      }
});
</script>

我还要关闭吗?

谢谢， 杰夫

推荐答案

您实际上非常亲密！您忘记了show()和hide()方法之后的():

You're actually very close! You're forgetting () after the show() and hide() methods:

if ($(this).is(':checked')) {
    $(pClass).show();
} else {
    $(pClass).hide();
}

这是一个演示

这篇关于根据复选框选择显示/隐藏对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！