检查是否选择了 optgroup 中的部分或全部选项答案

【问题标题】：Check if some or all options in optgroup selected检查是否选择了 optgroup 中的部分或全部选项
【发布时间】：2017-12-25 22:36:32
【问题描述】：

我有一个从 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</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>

我正在尝试确定是否选择了 optgroup 中的所有选项。从这里开始，如果选择了所有选项或仅选择了 optgroup 中的几个选项，我将生成一个字符串，因此如果选择了整个美国：

country = {[US]}

如果只选择了 TN 和 MS：

state = {country: US, statelist: [TN, MS]}

我的第一次尝试是这样的：

$(".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]

【问题讨论】：

标签： javascript jquery html option optgroup

【解决方案1】：

你必须做更多的检查，看看是否全部被选中：

$(".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);
        });
    }
});

【讨论】：

【解决方案2】：

在开始推入之前，您似乎没有将“statearray”声明为数组。 “state_flag”和“country_flag”也一样。

【讨论】：

【解决方案3】：

试试这个......希望它会工作

$("#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
    }
});

【讨论】：