Question

我有3个HTML组合/下拉框。他们都有一个独特的名称和身份。在特定事件中，我想获得所有这三个的价值。任何人都可以给我一个代码片段吗？

Answer 1

使用jQuery：

$("#dropdownID").val();

Answer 2

为此不使用jQuery：

function getSelectValues() {
    var values = [];
    for (var i = 0; i < arguments.length; i++) {
        var select = document.getElementById(arguments[i]);
        if (select) {
            values[i] = select.options[select.selectedIndex].value;
        } else {
            values[i] = null;
        }
    }
    return values;
}

此函数返回与您传递给函数的id对应的值数组，如下所示：

var selectValues = getSelectValues('id1', 'id2', 'id3');

如果<select>与您指定的id之一不存在，则数组包含null作为该位置的值。

还有其他几种方法可以执行此操作，您可以将函数传递给id值数组：getSelectValues([ 'id1', 'id2', 'id3' ])，在这种情况下，函数将会更改：

function getSelectValues(ids) {
    var values = [];
    for (var i = 0; i < ids.length; i++) {
    // ...

您还可以将函数传递给id s的地图并填充值：

var myMap = { 'id1': null, 'id2': null, 'id3': null };
getSelectValues(myMap);
// myMap['id1'] contains the value for id1, etc

这会将函数更改为：

function getSelectValues(map) {
    for (var id in map) {
        var select = document.getElementById(id);
        if (select) {
            map[id] = select.options[select.selectedIndex].value;
        } else {
            map[id] = null;
        }
    }
}

Answer 3

我尝试在HTML中将它们彼此相邻设置，然后使用jQuery的内置each（）方法迭代它们。你要设置这样的元素：

<div id="dropdownBoxes">
<select id="firstElement">
    <option>cool</option>
    <option>neat</option>
</select>
<select id="secondElement">
    <option>fun</option>
    <option>awesome</option>
</select>
<select id="thirdElement">
    <option>great</option>
    <option>synonym</option>
</select>
</div>

<input type="button" id="theTrigger">Push me!</input>

然后，在你的脚本中：

var dropdownValues;

$("#theTrigger").click(function(){    
dropdownValues.length=0;
$("#dropdownBoxes select").each(function(){
    dropdownValues.push($(this).val());
    });
});

Answer 4

使用像上面提到的jQuery这样的框架，或者只是按照旧学校的方式去做。 document.getElementById('dropdownId').value。

JavaScript：获取下拉值

4 个答案: