为什么我的基于单选按钮的隐藏/显示元素功能不起作用

Why my function hide/show element base on radio button not work?

本文关键字:显示 元素 功能 不起作用 隐藏 我的 单选按钮 为什么      更新时间:2023-09-26

为什么我的基于单选按钮的函数隐藏/显示元素不起作用?

http://jsfiddle.net/qmzz9x7h/

<script>
    $(document).ready(function(){
        $('input[type="radio"]').click(function(){
            if($(#radio_id).attr("value")=="first"){
                $("#second_checkbox").hide();                
                $("#first_checkbox_display").show();
            }
            if($(#radio_id).attr("value")=="second"){
                $("#first_checkbox_display").hide();                
                $("#second_checkbox").show();
            }
        });
    });
</script>

你的小提琴错了,看看简短的改进版本:

$(document).ready(function(){
    $('input[type="radio"]').click(function(e){
        var _val = $(this).val();
        var _id = $(this).attr('id'); // Grap the ID
        $("#second_checkbox, #first_checkbox_display").hide(); 
        console.log(_val);
        if( _val == "first" ){
            $("#"+_val+"_checkbox_display").show();
        }
        else if( _val =="second"){    
            $("#"+_val+"_checkbox").show();
        }
    });
});

演示

<script>
    $(document).ready(function(){
        $(".radio_id").click(function(){
            if($(this).attr("value")=="first"){
                $("#second_checkbox").hide();                
                $("#first_checkbox_display").show();
            }
            if($(this).attr("value")=="second"){
                $("#first_checkbox_display").hide();                
                $("#second_checkbox").show();
            }
        });
    });
</script>

给你的单选按钮一个class"radio_id"