博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
关于在ie7,8等低版本浏览器的获得<select>元素的值的的兼容性问题
阅读量:5817 次
发布时间:2019-06-18

本文共 1815 字,大约阅读时间需要 6 分钟。

通过如下代码展示解决该兼容性方案!

第一种:check2函数里面的方案可以针对option没有设置value和设置了value的情况

<html>
<head>
<meta charset="utf-8">
<title>select</title>
</head>

<body>

<!-- A种情况 option未设置value -->
<select name="select" id="select1">
<option selected="selected">Test1</option>
<option >Test2</option>
</select>

<!-- B种情况 option设置value -->

<select name="select2" id="select2">
<option value="Test1" selected="selected">Test1</option>
<option value="Test2">Test2</option>
</select>

<input type="button" value="我要试试" οnclick="check1()">

<input type="button" value="我要试试" οnclick="check2()">

<script>
function check1() {
//当上面option里没有设置value属性时
var value = document.getElementById("select1").options[document.getElementById("select1").options.selectedIndex].value,
text = document.getElementById("select1").options[document.getElementById("select1").options.selectedIndex].text;
console.log(value);
console.log(text);

}

function check2() {
//当上面option里设置value属性时
var value = document.getElementById("select2").options[document.getElementById("select2").options.selectedIndex].value,
text = document.getElementById("select2").options[document.getElementById("select2").options.selectedIndex].text;
console.log(value);
console.log(text);

}

</script>

</body>

</html>

第二种:check1函数里面的方案可以针对option设置了value的情况

<html>
<head>
<meta charset="utf-8">
<title>select</title>

</head>

<body>

<select name="select1" id="select1">
<option value="Test1" selected="selected">Test1</option>
<option value="Test2">Test2</option>
</select>

<input type="button" value="我要试试" οnclick="check1()">

<script>
function check1(){
//当上面option里设置了value属性时
var select = document.getElementById("select1").value;
console.log(select);
console.log(document.getElementById("select1").options.selectedIndex);
}

</script>

</body>

</html>

转载于:https://www.cnblogs.com/meij/p/4912624.html

你可能感兴趣的文章
vSphere 6将于2月2日全球同步发表
查看>>
Android状态栏实现沉浸式模式
查看>>
让你的APP实现即时聊天功能
查看>>
iOS 绝对路径和相对路径
查看>>
使用Openfiler搭建ISCSI网络存储
查看>>
IntPtr 转 string
查看>>
学生名单
查看>>
(转) 多模态机器翻译
查看>>
【官方文档】Nginx负载均衡学习笔记(三) TCP和UDP负载平衡官方参考文档
查看>>
矩阵常用归一化
查看>>
Oracle常用函数总结
查看>>
【聚能聊有奖话题】Boring隧道掘进机完成首段挖掘,离未来交通还有多远?
查看>>
USNews大学排名遭美国计算机研究学会怒怼,指排名荒谬要求撤回
查看>>
七大关键数据 移动安全迎来历史转折点
查看>>
盘点物联网网关现有联网技术及应用场景
查看>>
mui 总结2--新建第一个app项目
查看>>
nginx的lua api
查看>>
考研太苦逼没坚持下来!看苑老师视频有点上头
查看>>
HCNA——RIP的路由汇总
查看>>
zabbix监控php状态(四)
查看>>