WEB 前端技术分享,Javascript 获取被选中的单选/复选按钮、下拉框的值

js代码片段,获取单选按钮组、下拉框的value值

发布用户:小梦

2023/02/17 13:20


//根据指定的 Name 值获取相应被选中的 radio 值
function GetRadioValue(_radioName) {
    var radios = document.getElementsByName(_radioName);
    for (var i = 0; i < radios.length; i++) {
        if (radios[i].checked) {
            return radios[i].value;
        }
    }
}

 

假设页面上有多个 <input name="radios" type="radio" /> 标签,GetRadioValue("radios") 能够获取被选中单选按钮的 value 属性值。同理,获取所有复选框的值只需稍稍调整代码便是。

//示例代码
var checks = document.getElementsByName("checks");
var selected_datas = new Array();
for (var i = 0; i < checks.length; i++) {
    if (checks[i].checked) {
        selected_datas.push(checks[i].value);
    }
}

 

思路是在原代码基础上多加一个数组用于存储复选框中的值。

【获取下拉框选中的值】

假设 select 元素的结构如下:

<select id="select1">
    <option value="1" selected="selected">value1</option>
    <option value="2">value2</option>
    <option value="3">value3</option>
</select>

 

select 元素的 options 属性可以获取到其下所有的 option 元素,然后再通过选中项的索引值获取相应 option 元素的值:

var select1 = document.getElementById("select1");

//选中项的索引 select1.selectedIndex
//显示文本 select1.options[0].text
//值 select1.options[0].value


代码写多了,脑力不够用了,请我喝杯咖啡提提神 ☕

警告!禁止网络诈骗、非法集资、非法套现等法律外的缘由转账汇款,你的赞赏转账请考虑再三后支付,此收款不作任何形式的退款。





金额:

* 支付宝支付后如果没有自动返回请手动返回此页并刷新。



* 在线内容服务不支持任何形式的退款/退费操作;支付后的订单记录可以在“用户主页 - 用户订单中心”查看。

此网站可能不完全兼容您目前的浏览器!
此页随时可能被替换下线,请不要依赖此页功能!
此页正在维护更新,可能会出现错误或卡顿。
通知 & 公告

暂时还没有消息