从选择标签中获取javascript中的值

get value in javascript from select tag

本文关键字:javascript 获取 标签 选择      更新时间:2023-09-26

我使用javascript函数从特定的<select></select>获取id。

<select name="no" id="dropdownlist" class="defaultvalue" style="width: 100%;">
  <option value="">Select Option</option>
</select>

但问题是我有8 <select></select>下拉,我想得到这些在javascript中的值,如:

var list = document.getElementById('dropdownlist');

但这只能通过使用getElementByClass来实现,但这对我来说不起作用。

由于你用jquery标记了你的问题,我建议你使用它:

$('#dropdownlist').val();

更新:但是如果你有8个选择-只需为他们使用相同的类,你可以使用下一个代码:

$('.className').each(function(i,el){
  console.log($(this).val());
})

没有getElementByClass,它是getElementsByClassName,但您不妨使用querySelectorAll,它有更好的支持

var list  = [];
var elems = document.querySelectorAll('.defaultvalue');
for (var i=0; i<elems.length; i++) {
    list.push( elems[i].value );
}

小提琴

在jQuery中,你可以使用
var list = $.map($('.defaultvalue'), function(el) { return el.value});

小提琴

和ID是唯一的,它们不能用于同一文档中的多个元素

如果你想使用纯javascript的多选择标签,那么使用下面的代码

function getAllValue(){
    var allSelectTags  = document.getElementsByClassName("defaultvalue");
    var selVal = [];
    for(var i=0; i<allSelectTags.length; i++){
         var value = allSelectTags[i].options[allSelectTags[i].selectedIndex].value;
         selVal.push(value);
    }
    var result = "";
    for(var j=0; j<selVal.length; j++){
        result += selVal[j] + "<br />";
    }
    document.getElementById("result").innerHTML = result;
}