选中单选按钮时切换DIV
|
当一组单选按钮说是或否时,我试图使DIV切换可见且不可见。
例如,我有一个DIV中的商店列表,但是我只希望当单选按钮被选中为“是”时,该商店列表可见。
编辑脚本视图
<div id=\"script_form_wrapper\">
<%= form_for(:script, :url => {:action => \'update\', :id =>@script.id}) do |f| %>
<div id=\"script_form_visibility\">
<div class=\"issue_section_header\" align=\"center\">Visibility</div>
<div class=\"line-break\"></div>
<div class=\"standardText\"><span class=\"boldText\">All Stores:</span>
<%=f.radio_button(:all_stores, true)%> Yes
<%=f.radio_button(:all_stores, false)%> No
</div>
<br/>
<div id=\"script_stores\">
<div class=\"issue_section_header\" align=\"center\">Stores</div>
<div class=\"line-break\"></div>
<div class=\"standardText\">
<%@stores.each do |store|%>
<%= check_box_tag \'script[store_ids][]\', store.id, @script.store_ids.include?(store.id), :id => dom_id(store) %>
<%= label_tag dom_id(store), store.name, :class => \"check_box_label\" %><br/>
<%end%>
</div>
</div>
</div>
<div id=\"script_form\">
<div class=\"boldText\"><%= f.label :name %></div>
<div><%=f.text_field :name, :size => \'94\', :maxlength => \'70\'%></div>
<div>
<table width=\"100%\" cellspacing=\"0\">
<tr>
<td class=\"boldText\"><%= f.label :category_id, \"Category\" %></td>
<td class=\"boldText\" align=\"right\">Show ID Required Field</td>
</tr>
<tr>
<td class=\"standardText\"><%=f.select(:category_id, @categories.collect {|c| [c.name, c.id]}, :selected => session[:admin_category])%></td>
<td class=\"standardText\" align=\"right\"><%=f.radio_button(:require_id, true)%> Yes <%=f.radio_button(:require_id, false)%> No</td>
</tr>
</table>
</div>
<div class=\"boldText\"><%= f.label :task %></div>
<div><%= f.text_area(:task, :size => \"68x20\") %></div>
<div class=\"boldText\"><%= f.label :expected_results, \"Expected Results\" %></div>
<div><%= f.text_area(:expected_results, :size => \"68x20\") %></div>
<div align=\"center\"><%= f.submit \"Update Script\" %></div>
</div>
<% end %>
</div>
悲伤的Java尝试
<script type=\"text/javascript\">
$(function() {
$(\"[name=script[all_stores]]\").click(function(){
$(\'#script_stores\').hide();
$(\"#script_all_stores_\"+$(this).val()).show(\'slow\');
});
});
</script>
渲染的HTML源
<div class=\"standardText\"><span class=\"boldText\">All Stores:</span>
<input id=\"script_all_stores_true\" name=\"script[all_stores]\" type=\"radio\" value=\"true\" /> Yes
<input checked=\"checked\" id=\"script_all_stores_false\" name=\"script[all_stores]\" type=\"radio\" value=\"false\" /> No
</div>
解
<script type=\"text/javascript\">
$(function() {
if($(\"#script_all_stores_false\").is(\":checked\")){
$(\'#script_stores\').show();
}else{
$(\'#script_stores\').hide();
}
$(\"input[name=\'script[all_stores]\']\").change(function(){
if($(\"#script_all_stores_false\").is(\":checked\")){
$(\'#script_stores\').show();
}else{
$(\'#script_stores\').hide();
}
});
});
</script>
谢谢你的帮助!!!
没有找到相关结果
已邀请:
3 个回复
坝硷操
要么
舶啥戚
公藕
谢谢