如何隐藏和显示div如果单选按钮在jquery

Question

在wordpress中检查我创建一些metaboxes的后期格式，所以当用户点击一个单选按钮或其已经检查了metabox显示显示。

这里是我尝试了一些jQuery的，但即时通讯使用jQuery不好的代码

HTML：

<div id="post-formats-select"> 
    <input type="radio" id="post-format-0" class="post-format" value="0" name="post_format" /> 
    <label class="post-format-standard">Standard</label> 

    <input type="radio" id="post-format-chat" class="post-format" value="chat" name="post_format" /> 
    <label class="post-format-chat">Chat</label> 

    <input type="radio" id="post-format-gallery" class="post-format" value="gallery" name="post_format" checked="checked" /> 
    <label class="post-format-gallery">Gallery</label> 

    <input type="radio" id="post-format-video" class="post-format" value="video" name="post_format" /> 
    <label class="post-format-video">Video</label>  
</div> 

<div class="meta-box-sortables"> 
    <div id="inpost_chat_box" class="postbox"> 
     Chat Box 
    </div>  

    <div id="inpost_gallery_box" class="postbox"> 
     Gallery Box 
    </div> 

    <div id="inpost_video_box" class="postbox"> 
     Video Box 
    </div>  
</div> 

JQuery的：

$('#inpost_chat_box, #inpost_gallery_box, #inpost_video_box').hide(); 

var formats = $('#post-formats-select input'); 
formats.on('change', function(){ 
    if($(this).is(':checked').val() == 'gallery') { 
     $('#inpost_gallery_box').show(); 
    } 
}); 

Answer 1

你不能链.is()，因为它返回一个boolean不是jQuery对象。没有内.is().val()方法，所以它可能抛出一个：

Uncaught ReferenceError: undefined is not a function

，如果你检查浏览器的控制台。

尝试打破条件分为两个语句，像这样：

formats.on('change', function(){ 
    if(this.checked && this.value == 'gallery') { 
     $('#inpost_gallery_box').show(); 
    } 
});