如何使用JavaScript或jQuery获取数组中选定的optgroup和选项

How to obtain the selected optgroup and options in array with JavaScript or jQuery

本文关键字：optgroup 选项 数组 JavaScript 何使用 jQuery 获取      更新时间：2023-09-26

如何使用JavaScript或jQuery在数组中获取选定的optgroup和选项。我需要将optgourp和option都放入一个数组中，但只需要选定的两个。

<select id="release">
    <optgroup label="group1">
        <option>option 1</option>
        <option>option 2</option>
    </optgroup>
    <optgroup label="group2">
        <option>option 3</option>
        <option>option 4</option>
    </optgroup>
</select>
var releasearr = {};
var theSelect = document.getElementById('release');
var optgroups = theSelect.getElementsByTagName('optgroup');
for (var i = 0; i < optgroups.length; i++) {
    releasearr[optgroups[i].getAttribute('label')] = [];
    var options = optgroups[i].getElementsByTagName('option');
    for (var j = 0; j < options.length; j++) {
        releasearr[optgroups[i].getAttribute('label')].push(options[j].innerHTML);
    }
}
console.log(releasearr);

在html中搜索按钮

在javascript 中

var requestString = "?re_type="+document.getElementById('route').value+"&platform="+document.getElementById('platform').value+"&baserelease="+document.getElementById('bsrel').value+"&release="+releasearr+"&release_type="+document.getElementById('type').value+"&rpd_bit="+document.getElementById('rpd_bit').value;;

并传递到url ='/rbusnp/controller/releasecompresult.php'+requestString;

在我得到的值中，releaser是作为[对象对象]没有得到值

我正在为这个下拉菜单使用多个选项。但是，当我选择一个optgroup和两个选项时，它只返回一个optgroup和一个选项，如何获得多个选择的数组。

在Jquery中非常简单：

var $optionSelected = $('option:selected');
var optGroup = $optionSelected.parents('optgroup');

如果您有select元素并使用.find（）

，效果会更好

试试这个，

var releasearr = {};
var theSelect = document.getElementById('release');
var optgroups = theSelect.getElementsByTagName('optgroup');
var arr = {};// object for selected options
for (var i = 0; i < optgroups.length; i++) {
    l=optgroups[i].getAttribute('label');
    releasearr[l] = [];
    var options = optgroups[i].getElementsByTagName('option');
    for (var j = 0; j < options.length; j++) {
        releasearr[l].push(options[j].innerHTML);
        if(options[j].selected){ // check if options is selected
            arr[l]= [];// making array of optgroup
            arr[l].push(options[j].innerHTML);
        }
    }
}
console.log(releasearr);
// selected options array
console.log(arr);

演示

使用jquery，你可以试试这个，

var arr= {};
$('#release option:selected').each(function(){
    arr[$(this).closest('optgroup').attr('label')] = $(this).text();
});
console.log(arr);

jQuery演示

更新您应该使用JSON.stringify（）将object作为类似string的传递

route=document.getElementById('route').value;
platform=document.getElementById('platform').value;
bsrel=document.getElementById('bsrel').value;
type=document.getElementById('type').value;
rpd_bit=document.getElementById('rpd_bit').value;
var requestString = "?re_type="+route+"&platform="+platform+"&baserelease="+bsrel;
requestString += "&release_type="+type+"&rpd_bit="+rpd_bit;
requestString += "&release="+JSON.stringify(releasearr);// use stringify here

要在selected option from optgroup中选择所有option，请尝试此操作，

var arr= {};
$('#release option:selected').each(function(){
    var newArr=[];
    $(this).closest('optgroup').find('option').each(function(){
        newArr.push($(this).text());
    });
    arr[$(this).closest('optgroup').attr('label')] = newArr;
});
console.log(arr);

演示2

相关文章：