可能重复:
jQuery disable SELECT options based on Radio selected (Need support for all browsers)
我有两个单选按钮
<html>
<input type="radio" class="status" name="status" checked="checked" value="New" />New
<input type="radio" class="status" name="status" value="Used" />Used
<select id="Insurance_type">
<option>Home Used Insurance1</option>
<option>Home New Insurance1</option>
<option>Home Used Insurance2</option>
<option>Home New Insurance2</option>
</select>
</html>
当我选择New单选按钮时,我需要一个Jquery脚本,它将过滤下拉列表。我只有新的保险类型。
答案 0 :(得分:2)
您可以使用:contains()选择器执行此操作:
$('input[name="status"]').change(function(){
$('#Insurance_type option').show();
$('#Insurance_type option:contains("'+$(this).val()+'")').hide();
});
示例:http://jsfiddle.net/mknvv/21/
off以确定 .siblings().show()
无法在那里工作的原因......
修改强>
使用sibling();
var a = '#Insurance_type option:contains("'+$(this).val()+'")';
$(a).show().siblings().not(a).hide();
答案 1 :(得分:0)
尝试使用此JavaScript,将ID替换为您在页面上使用的ID:
$("#homeUsedInsurance1").bind("focus blur click",function(){
$("#dropDownList").html("<option value=one>option one</option><option value=two>option two</option>");
});
然后重复所有其他单选按钮。
广告@米
答案 2 :(得分:0)
为新按钮添加ID到此单选按钮 -
<input type="radio" class="status" name="status" checked="checked" id="new" value="New" />New
$('#new).click(function(){
$('#Insurance_type option').each(function(i, option){
if($(option).text().indexOf('new Insurance') < 0){
$(option).remove();
}
})
});
为其他单选按钮执行此操作 未经测试,但我认为这应该有效。
答案 3 :(得分:0)
$('.status').change(function() {
var v = $('.status:checked').val(); // get chosen value
$('#Insurance_type option').hide(); // first hide all
$('#Insurance_type option:contains("' + v + '")').show(); // Show only those that contain value
$('#Insurance_type option:visible:first').attr('selected', true); // myst select a non-hidden value!
});
答案 4 :(得分:0)
这是一个重复的问题,请参阅此处的函数答案jQuery disable SELECT options based on Radio selected (Need support for all browsers)
答案 5 :(得分:0)
最好的方法是有一个额外的选择元素:
<input type="radio" class="status" name="status" checked="checked" value="New" />New
<input type="radio" class="status" name="status" value="Used" />Used
<select id="used" style="display: none">
<option>Home Used Insurance1</option>
<option>Home Used Insurance2</option>
</select>
<select id="new">
<option>Home New Insurance1</option>
<option>Home New Insurance2</option>
</select>
然后,您可以在选中收音机框时显示/隐藏每个人:
$(".status").change(function(){
var $new = $("#new"),
$used = $("#used");
if( $(this).val() == "New" ){
$new.show();
$used.hide();
} else {
$new.hide();
$used.show();
}
});