当一组单选按钮说是或否时,我试图使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>
悲伤尝试Javascript
<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>
谢谢你的帮助!!!
答案 0 :(得分:2)
$("[name=script[all_stores]]").change(function(){
$('#script_stores').toggle();
});
或
$("[name=script[all_stores]]").change(function(){
if($(this).is(":checked")){
$('#script_stores').show();
}else {
$('#script_stores').hide();
}
});
答案 1 :(得分:0)
试试这个:
$("[name='script[all_stores]']").change(function(){
if($(this).val()=="true"){
$('#script_stores').show();
}else {
$('#script_stores').hide();
}
});
答案 2 :(得分:0)
能够使用以下javascript实现此功能
<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>
由于