Jquery 根据RadioButton列表选择的输入隐藏和显示多个区域

我之前有一个类似的问题，但我不得不修改它，因为用户改变了主意。我正在编写一个脚本，如果选择了选项0，它应该显示“提醒”，否则将其隐藏。如果选择选项2，则应取消隐藏“cc”，否则将其隐藏。我的问题是，一旦触发事件，无论选项0或2如何，这两个区域都会打开。我只是想知道我是否能得到一些帮助，让他们分开工作。 以下是JS：

 $('#rbPType').change(function () {
 var op1 = $(this).attr('value', '0');
 var op2 = $(this).attr('value', '2');

 if (op1) {
    $('#remind').fadeIn();
 } else {
    $('#remind').fadeOut();
 }

 $(this).change(function () {
     $('#remind').toggle();
 });

 if (op2) {
     $('#cc').fadeIn();
 } else {
     $('#cc').fadeOut();
 }

 $(this).change(function () {
     $('#cc').toggle();
 });

 });

HTML

选择一个
提醒我
提醒我两个

我认为您在这里编写了很多不必要的代码。jquery toggle采用布尔参数，当为true时将显示选定字段，当为false时将隐藏该字段

    $('#rbPType').change(function () {
     var op1 = $(this).attr('value', '0');
     var op2 = $(this).attr('value', '2');
     $('#remind').toggle(op1);
     $('#cc').toggle(op2);
    });

---

这就是您要找的吗？

您不能有两个具有相同的

ddlMemberMonth

的下拉列表

由于切换，您的控件在单击后出现和消失。切换使您的代码非常混乱

<div class="another">
    <label for="rbPType">
        Select One</label>
    <asp:RadioButtonList runat="server" ID="rbPType" ClientIDMode="Static">
        <asp:ListItem Value="0" Text="1"></asp:ListItem>
        <asp:ListItem Value="1" Text="2"></asp:ListItem>
        <asp:ListItem Value="2" Text="3"></asp:ListItem>
    </asp:RadioButtonList>
</div>
<div id="remind">
    <label for="ddlReminderMonth">
        Remind Me</label>
    <asp:DropDownList runat="server" ID="ddlReminderMonth1" AppendDataBoundItems="true"
        AutoPostBack="false" />
</div>
<div id="cc">
    <label for="ddlReminderMonth">
        Remind Me Two</label>
    <asp:DropDownList runat="server" ID="ddlReminderMonth2" AppendDataBoundItems="true"
        AutoPostBack="false" />
</div>


<script>
    $('#rbPType').change(function () {
        var value = $('#rbPType input:checked').val();

        if (value == '0') {
            $('#remind').fadeIn();
            $('#cc').fadeOut();
        }
        else if (value == '1') {
            // Show or hide
        }
        else { // value == '2'
            $('#remind').fadeOut();
            $('#cc').fadeIn();
        }
    }); 
</script>

选择一个
提醒我
提醒我两个
$（'#rbPType'）。更改（函数（）{
var值=$（'#rbPType输入：选中'）.val（）；
如果（值='0'）{
$（'提醒'）.fadeIn（）；
$（'#cc'）.fadeOut（）；
}
else if（值='1'）{
//显示或隐藏
}
else{//value=='2'
$（“#提醒”）.fadeOut（）；
$（'#cc'）.fadeIn（）；
}
}); 

很抱歉html太乱了。你又是我的救世主！好吧，这一个有一些不应该隐藏的东西。我不知道你为什么能提醒op1和op2变量中的值。我怀疑你在这些变量中没有得到预期的标志。

<div class="another">
    <label for="rbPType">
        Select One</label>
    <asp:RadioButtonList runat="server" ID="rbPType" ClientIDMode="Static">
        <asp:ListItem Value="0" Text="1"></asp:ListItem>
        <asp:ListItem Value="1" Text="2"></asp:ListItem>
        <asp:ListItem Value="2" Text="3"></asp:ListItem>
    </asp:RadioButtonList>
</div>
<div id="remind">
    <label for="ddlReminderMonth">
        Remind Me</label>
    <asp:DropDownList runat="server" ID="ddlReminderMonth1" AppendDataBoundItems="true"
        AutoPostBack="false" />
</div>
<div id="cc">
    <label for="ddlReminderMonth">
        Remind Me Two</label>
    <asp:DropDownList runat="server" ID="ddlReminderMonth2" AppendDataBoundItems="true"
        AutoPostBack="false" />
</div>


<script>
    $('#rbPType').change(function () {
        var value = $('#rbPType input:checked').val();

        if (value == '0') {
            $('#remind').fadeIn();
            $('#cc').fadeOut();
        }
        else if (value == '1') {
            // Show or hide
        }
        else { // value == '2'
            $('#remind').fadeOut();
            $('#cc').fadeIn();
        }
    }); 
</script>