问题描述
我有以下2个选择列表..我想隐藏State / Prov,直到所选国家/地区有相应的optgroup标签。所以..
I have the following 2 select lists.. I'd like to hide State/Prov until the chosen Country has a corresponding optgroup label. So..
- 用户选择Alegeria ..没有显示状态选择..
--User Selects Alegeria.. No State select is shown..
- 用户选择美国或加拿大; 状态选择仅显示optgroup标签与父母姓名匹配的值。
--User Selects United States or Canada; The State Selects appears showing only the values where optgroup label matches the parents name.
有意义吗?无法找到基于OptGroup的方法而不必手动为每个子对象分配类
Make Sense? Can't find a way to do it based on OptGroup vs. having to manually assign a 'class' to each child object
<select id="C_Country" name="C_Country" aria-required="true" class="required">
<option value=" " selected="">-- Please Select --</option>
<option value="AF">Afghanistan</option>
<option value="AX">Aland Islands</option>
<option value="USA">United States</option>
<option value="DZ">Algeria</option>
<option value="CA">Canada</option>
<option value="AD">Andorra</option>
</select>
<p><label for="C_State_Prov">State or Province <span title="required">*</span></label></p>
<select id="C_State_Prov" name="C_State_Prov" aria-required="true" class="required">
<option value="" selected="">-- Please Select --</option>
<optgroup label="United States">
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
<option value="AZ">Arizona</option>
<option value="CA">California</option>
</optgroup>
<optgroup label="Canada">
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
<option value="MB">Manitoba</option>
</optgroup>
</select>
推荐答案
我认为就是你想要的。
I think this is what you want.
$(function(){
var state_province = $('#C_State_Prov option, #C_State_Prov optgroup');
state_province.hide(); // hide all state and provinces on page load
$('#C_Country').change(function(){
state_province.hide(); // on change of drop down hide all state provinces
// find the optgroup with the label = the html of the selected dropdown
// select the opt group and all of it's children and show them
$("#C_State_Prov optgroup[label='"+$(this).find(':selected').html() + "']")
.children()
.andSelf()
.show();
});
});
这可以多清理一下,但你明白了。
This can be cleaned up a little more but you get the idea.
这篇关于jQuery Chaining国家/州选择OptGroup的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!