html select value（请问：如何在html中利用select标签，选中多个选项，且把选中的多个option的value值，）
本文目录
- 请问：如何在html中利用select标签，选中多个选项，且把选中的多个option的value值，
- Html读取select控件的值
- jquery获取HTML select下拉列表中新选中option的value值，必须要重新刷新一下页面么
请问：如何在html中利用select标签，选中多个选项，且把选中的多个option的value值，
《select》
《option value =“volvo“》Volvo《/option》
《option value =“saab“》Saab《/option》
《option value=“opel“》Opel《/option》
《option value=“audi“》Audi《/option》
《/select》
select只能选中一个值，如果你想选中多个，可以使用一组，或是使用checkbox
《p》《input type=“checkbox“ name=“vehicle“ value=“Bike“ /》 I have a bike《/p》
《p》《input type=“checkbox“ name=“vehicle“ value=“Car“ /》 I have a car《/p》
Html读取select控件的值
这个无法用 HTML 去读取，需要用到 JavaScript。代码如下：
《!DOCTYPE html》《html lang=“en“》
《head》
《meta charset=“UTF-8“》
《title》Document《/title》
《/head》
《body》
《select id=“select1“》
《option value=“0“》== 请选择 ==《/option》
《option value=“1“》苹果《/option》
《option value=“2“》香蕉《/option》
《option value=“3“》桃子《/option》
《/select》
《p id=“result“》《/p》
《script》
document.getElementById(’select1’).onchange = function() {
var getText = function(elm) {
if (typeof elm.innerText == ’string’) {
return elm.innerText;
}
return elm.textContent;
};
var value = this.value,
index = this.selectedIndex,
text = getText(this.options[index]);
document.getElementById(’result’).innerHTML = ’【’ + value + ’】 ’ + text;
}
《/script》
《/body》
《/html》
jquery获取HTML select下拉列表中新选中option的value值，必须要重新刷新一下页面么
不需要重新刷新页面。新选中下拉列表（select）的选项（option）会触发change事件，即选择项改变事件，因此可以在change事件的响应函数中获取新选中option的value值，而不必要刷新页面。实例演示如下:
1、HTML结构
《select id=“test“ onchange=“fun()“》《option value=“option-A“》option-A《/option》
《option value=“option-B“》option-B《/option》
《option value=“option-C“》option-C《/option》
《option value=“option-D“》option-D《/option》
《/select》
2、javascript代码
function fun(){var select = document.getElementById(“test“);
alert(select.value);
}
3、效果演示
更多文章：
issued retroactively（FORM E上盖“ISSUED RETROACTIVELY”的问题，小女在线等待）
2026年10月15日 10:30
2026年10月15日 10:10
begin和start的区别（start与begin的区别）
2026年10月15日 09:20
vant官网中文（范特365 是韩国化妆品VANT36.5吗）
2026年10月15日 09:10
2026年10月15日 08:10
2026年10月15日 07:30
prison break（越狱（prison break）到底是在讲个什么）
2026年10月15日 06:50
c程序设计第五版教学视频（求C程序设计（第五版）谭浩强教材源代码、视频课件等电子版资料！谢谢大家！）
2026年10月15日 06:40
2026年10月15日 06:20
十六进制转二进制表（16进制转为2进制、8进制、10进制的公式）
2026年10月15日 06:10
