By -
陳 瞽鱦
jQuery取得select选中的值和文本
我们的Java软件工程师笔试中包含这个题目,许久不写代码,先自己温习下:
基本操作
$("#select1").val(); //取得选中的值 $("#select1").text(); //非取得选中项的文本,不可望文生义! $("#select1").find("option:selected").text(); //取选中的文本 //添加事件 $("#select1").change(function () {console.log("Code");}); //动态修改 option $("#select1").prepend("<option value='0'>请选择</option>"); $("#select1").append("<option value='Val'>Txt</option>"); //Mixed with DOM $("#select1").get(0).selectedIndex //获取Select选择的索引值
进阶测试
<form action=""> <select name="select_date" id="select_date"> <optgroup label="Select Date"> <option value="0">Custom Date</option> </optgroup> <optgroup label="Or Custom Date"> <option value="1" selected="selected"> Current Month</option> <option value="2"> Last Month</option> <option value="3"> Last 3 Months</option> <option value="4"> Last 6 Months</option> <option value="5"> Last Ever</option> </optgroup> </select> <div id="test">hide me</div> </form>
$("#select_date").bind("change", function () { $("#test").toggle(this.value != 3); alert($("#select_date").find("option:selected").text() + ": " + $("#select_date").val()); })/*.change()*/; </script>
参考:
http://api.jquery.com/selected-selector/
How do I get the text value of a selected option