获取和设置select的选中项的值

<!DOCTYPE html>

成都创新互联公司从2013年创立，先为淮滨等服务建站，淮滨等地企业，进行企业商务咨询服务。为淮滨企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

<html>

<title>获取select的选中项的值</title>

</head>

<body>

<option value="0">请选择选项</option>

</select>

</body>

</html>

window.onload=function(){

var tags=document.getElementsByTagName("select");

//通过javascript来获取select的选中项【】

var s=document.getElementById("select0");

s.selectedIndex=2;//设置选中项的索引

var index= s.selectedIndex;//获取选中项的索引

console.log(s.options[index].value);//输出选中项的值：value=3

console.log(s.options[index].text);//输出选中项的option里面的值：选项三

//通过下面方法也可以获取下面的值

var selectedValue=document.getElementById("select0").value;

console.log(selectedValue);

//通过jquery方法去设置和获取

console.log($("#select0").find("option:selected").text());//得到选中的option的里面的text

console.log($("#select0").val());//得到选中的值

$("#select0").val(1);//设置选中的值

console.log($("#select0").val());

//jquery和javascript的结合使用

var sIndex=$("#select0").get(0).selectedIndex;

//根据text=‘选项四’，来选中该项

$("#select0 option[text='选项一']").attr("selected","true");

$("#select0 option[value='2']").remove();//删除value='2'的选项删除

//把除了第一项的其他项都删除

$("#select0 option[value!='0']").remove();//可用于在多个选择框相互关联，然后当其中一个选项框开始选中时，清空另一个选项框。

};

</script>

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容