如何找到所有 HTML select 标签的选中项-CFANZ编程社区

话不多说，咱就直奔主题吧，直接展示代码：

<body>
<select name="n_select" class="c_select" id="i_select1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<select name="n_select" class="c_select" id="i_select2">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4" selected >4</option>
<option value="5">5</option>
</select>
</body>

以下就是js的部分:

<script type="text/javascript">
JQ:
获取所有选中的项（获取所有的select的选中项需遍历载具体取相应的值）
$('[name=n_select] :selected');
$('.c_select option:selected');
$('.c_select').find('option:selected');
获取select 选中的值（只返回第一个select ）
$('[name=n_select] :selected').text(); // 获取select选中项的文本
$('[name=n_select] :selected').val(); // 获取select选中项的值
$('.c_select option:selected').text(); // 获取select选中项的文本
$('.c_select option:selected').val(); // 获取select选中项的值
$('.c_select').find('option:selected').text(); // 获取select选中项的文本
$('.c_select').find('option:selected').val(); // 获取select选中项的值
JS:
// 兼容至IE9+
var tag_select = document.getElementsByClassName('c_select'); // 获取所有select
// 至少兼容值IE7,IE6没测试
var tag_select = document.getElementsByTagName('select'); // 获取所有select
// 至少兼容值IE7,IE6没测试
var tag_select = document.getElementsByName('n_select'); // 获取所有select
// 至少兼容值IE7,IE6没测试（下面索引1只是随便举例，可遍历 tag_select 获取所有的）
var tag_sValue = tag_select[1].value; // 获取某个select选中项的值
var tag_sIndex = tag_select[1].selectedIndex; // 获取某个select选中项的索引
var tag_oValue = tag_select[1].options[tag_sIndex].value; // 获取某个select选中项的值
var tag_oTexts = tag_select[1].options[tag_sIndex].text; // 获取某个select选中项的文本 .text 或者 .innerText 都可以获取
</script>