jQuery：将display css从display：none改为显示：block not working(jQuery: changing div css from display:none to display:block not working)

 我正在根据复选框值更改div的内容。 除了一个复选框选项之外，div的值是简单文本。 在例外情况下，div的值是另一个div（可以说childDiv）。 
 
 所以，当点击其他两个选项时，我改变childDiv的可见性（ display: none通过jQuery.css() ），并在单击异常选项时将其更改为display: block 。 
 
 当我更改复选框选项时，childDiv变为隐藏。 但是，当我希望它可见时它不会再显示。 
 
 小提琴在这里： http ： //jsfiddle.net/sandeepy02/jLgyp/ 
 
 代码是 
 
            <div class="switch switch-three candy blue" id="reachout">
                <input name="reachout" type="radio" id="tab-41" value="1" checked="checked"/>
                    <label for="tab-41">Experience</label>
                <input name="reachout" type="radio" id="tab-42" value="2"/>
                    <label for="tab-42">Contact Us</label>
                <input name="reachout" type="radio" id="tab-43" value="3"/>
                    <label for="tab-43">Why?</label>
                <div id="test1234">
                    <div id="test12345">
                        Option Start
                    </div>
                </div>
                <span class="slide-button"></span>
            </div>  
 
 和 
 
     jQuery("input[name='reachout']",jQuery('#reachout')).change(
        function(e)
        {                   
            if(jQuery(this).val()=="1") 
            {
                jQuery("#test1234").html("");
                jQuery("#test12345").css("display","block");
            }
            if(jQuery(this).val()=="2") 
            {
                jQuery("#test1234").html("Option 2");
                jQuery("#test12345").css("display","none");
            }
            if(jQuery(this).val()=="3") 
            {
                jQuery("#test1234").html("Option 3");
                jQuery("#test12345").css("display","none");
            }
        });
 
 我甚至尝试过 
 
            jQuery("#test12345").css('position', 'absolute');
            jQuery("#test12345").css('z-index', 3000);
 
 display: block后display: block但没有奏效。 
 
 谢谢 

I am changing the content of a div based on the checkbox value. the value of the div is simple text for all but one checkbox option. In the exception case, the value of div is another div (lets say childDiv).
 
So I am changing the the visibility of the childDiv (display: none through jQuery.css()) when the other two options are clicked, and changing it to display: block when the exception option is clicked.
 
The childDiv becomes hidden when I change checkbox option. However it does not display back again when I want it to be visible.
 
The fiddle is here: http://jsfiddle.net/sandeepy02/jLgyp/
 
The code is
 
            <div class="switch switch-three candy blue" id="reachout">
                <input name="reachout" type="radio" id="tab-41" value="1" checked="checked"/>
                    <label for="tab-41">Experience</label>
                <input name="reachout" type="radio" id="tab-42" value="2"/>
                    <label for="tab-42">Contact Us</label>
                <input name="reachout" type="radio" id="tab-43" value="3"/>
                    <label for="tab-43">Why?</label>
                <div id="test1234">
                    <div id="test12345">
                        Option Start
                    </div>
                </div>
                <span class="slide-button"></span>
            </div>  
 
and
 
     jQuery("input[name='reachout']",jQuery('#reachout')).change(
        function(e)
        {                   
            if(jQuery(this).val()=="1") 
            {
                jQuery("#test1234").html("");
                jQuery("#test12345").css("display","block");
            }
            if(jQuery(this).val()=="2") 
            {
                jQuery("#test1234").html("Option 2");
                jQuery("#test12345").css("display","none");
            }
            if(jQuery(this).val()=="3") 
            {
                jQuery("#test1234").html("Option 3");
                jQuery("#test12345").css("display","none");
            }
        });
 
I even tried
 
            jQuery("#test12345").css('position', 'absolute');
            jQuery("#test12345").css('z-index', 3000);
 
after display: block but that didnt work.
 
Thanks

原文：https://stackoverflow.com/questions/15779804