Javascript 检查是否选择了optgroup中的部分或所有选项
我有一个从JSON动态生成的下拉列表。格式如下:Javascript 检查是否选择了optgroup中的部分或所有选项,javascript,jquery,html,option,optgroup,Javascript,Jquery,Html,Option,Optgroup,我有一个从JSON动态生成的下拉列表。格式如下: <optgroup id="US" label="United States class="optiongroup> <option value="AS">American Samoa</option> <option value="AL">Alabama</option> ... <option value="VI">US Virgin Islands<
<optgroup id="US" label="United States class="optiongroup>
<option value="AS">American Samoa</option>
<option value="AL">Alabama</option>
...
<option value="VI">US Virgin Islands</option>
<option value="UT">Utah</option>
<optgroup>
<optgroup id="CA" label="Canada" class="optiongroup">
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
...
<option value="QC">Quebec</option>
<option value="YT">Yukon Territory</option>
</optgroup>
$(".optiongroup").each(function() {
var optgroup = $(this);
$(optgroup.children()).each(function () {
if ($(this).is(':selected')) {
statearray.push($(this).attr('value'));
state_flag = 1; //see if state exists
} else {
country_flag = 0; //entire country not selected
}
}
如果仅选择TN和MS:
country = {[US]}
state = {country: US, statelist: [TN, MS]}
我的第一次尝试是这样的:
<optgroup id="US" label="United States class="optiongroup>
<option value="AS">American Samoa</option>
<option value="AL">Alabama</option>
...
<option value="VI">US Virgin Islands</option>
<option value="UT">Utah</option>
<optgroup>
<optgroup id="CA" label="Canada" class="optiongroup">
<option value="AB">Alberta</option>
<option value="BC">British Columbia</option>
...
<option value="QC">Quebec</option>
<option value="YT">Yukon Territory</option>
</optgroup>
$(".optiongroup").each(function() {
var optgroup = $(this);
$(optgroup.children()).each(function () {
if ($(this).is(':selected')) {
statearray.push($(this).attr('value'));
state_flag = 1; //see if state exists
} else {
country_flag = 0; //entire country not selected
}
}
出于某种原因,这对我不起作用
编辑:
如果我选择了两个状态,比如TN和AL,它将返回statelist:[Obj Obj]您需要做更多的检查,看看是否所有状态都被选中:
$(".optiongroup").each(function() {
var options = $(this).children("option"),
length = options.length;
if (options.filter(":selected").length == length) {
//all are selected, do something!
country_flag = 1;
return true; //continue
} else {
//Not all selected, so push states
options.filter(":selected").each(function() {
statearray.push(this.value);
});
}
});
看起来不像是在开始推入“statearray”之前将其声明为数组。“国旗”和“国旗”也是一样的。试试这个。。。希望它能起作用
$("#selectId").children('optgroup').each(function(){
if($(this).children('option').length == $(this).children('option:selected').length){
// do stuff here when all options were selected under an optgroup
}else{
// do stuff here when all options were NOT selected under an optgroup
}
});