为什么我的单选按钮不能直观地改变？变化激发但视觉外观不变

Question

问题：单选按钮触发更改，但不更改视觉外观。

我有一个简单的表单，可以发布状态更新或新的博客文章。除了textarea之外，所有表单域都隐藏在页面加载中。当你点击textarea时，会出现更多的表单，其中包括两个单选按钮，可让您在状态更新或博客文章之间进行选择。两者之间的区别在于，如果您单击标准单选按钮，则博客文章会获得一个名为“帖子标题”的附加字段。该方案将在此设立提琴：

http://jsfiddle.net/XH7eP/1/

所以这里的问题。您会注意到，如果您单击“标准”帖子格式，帖子标题字段确实按预期显示。改变是射击，但单选按钮没有改变其视觉外观。您可以单击任意一个来显示/隐藏帖子标题字段，但视觉外观不会改变。

我很难过。任何见解都将非常感激。这里是小提琴的代码。

<form id="new_post_form" name="status_update" method="post" action=""> 
<p>Update your status</p> 
<div class="upper"> 
    <div class="new_post_form_hiding_fields hide"> 
     <label>Post Format: </label> 
     <input type="radio" name="new_post_format" id="status-post-format" class="post-format-radio" value="status" checked="checked" /> <label>status</label> 
     <input type="radio" name="new_post_format" id="standard-post-format" class="post-format-radio" value="standard" /> <label>standard</label> 
     <div class="standard_post_format_fields hide"> 
      <label>Post Title</label> 
      <input type="text" id="new_post_title" name="title" value="" tabindex="3" /> 
     </div> 
    </div> 
</div> 
<textarea name="post_content" id="new_post_content" tabindex="2" style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 47px;"></textarea> 
<div class="new_post_form_hiding_fields hide"> 
    <input type="submit" id="new_post_submit" value="submit" tabindex="6" /> 
</div> 
</form> 

jQuery的未来

$('#new_post_form').click(function(e) { 
$('.new_post_form_hiding_fields').slideDown(); 
e.stopPropagation(); 
return false; 
}); 
$(document).click(function() { 
if($('.new_post_form_hiding_fields').is(":visible")) { 
    $('.new_post_form_hiding_fields').slideUp(); 
} 
}); 

$('.post-format-radio').click(function() { 
if($('#standard-post-format').prop('checked')) { 
    $('.standard_post_format_fields').fadeIn(); 
} else { 
    $('.standard_post_format_fields').fadeOut(); 
} 
}); 

Answer 1

当您使用stopPropagation返回false意味着你要停止任何点击执行，停止传播后，其不需要任何回报的方法将防止事件从护理冒泡。

$('#new_post_form').click(function(e) { 
$('.new_post_form_hiding_fields').slideDown(); 
e.stopPropagation(); }); 

jsfiddle.net/XH7eP/3/