从写前端以来select各种属性已经用到烂了,但总是时不时卡壳,甚是烦恼,今天终于抽时间做一个简单的总结
例如:有如下结构的select,涉及到的各种取值
<select name="addressee" id="mySelect" class="form-control riskinx-sel">
<option value="0" data-id="1">-请选择-</option>
<option value="1" data-id="2" >成都</option>
<option value="3" data-id="3" >绵阳</option>
<option value="4" data-id="4" >德阳</option>
</select>
一、获取#mySelect选中的value和text
1、$("#mySelect").val( )
$("#mySelect").text( )
2、$("#mySelect option:selected").val( )
$("#mySelect option:selected").val( )
二、获取#mySelect下的第一个、最后一个及第N个option元素的值
1、$('#mySelect ').children("option:last").val( )或者$('#mySelect option:last').val( )
2、$('#mySelect ').children("option:first").val( )或者$('#mySelect option:first').val( )
3、$('#mySelect option:nth-child( n )').val( ) // n从0开始
三、获取选中元素的索引
1、$('#mySelect ')[0].selectedIndex //该方法是原生JS的方法,所以必须直接使用jq对象,必须转化成原生dom对象调用该方法
四、指定值value或文本text的option为选中项
1、value:$('#mySelect ').val('xx')//想要指定的值
2、text:
$('#mySelect option').filter(function(){
return text.indexOf( $(this).text() )!= -1;
}).attr('selected',true);//DOM里没有text属性,所以使用 . 或者
[属性='值']这种叫做属性选择器来获取是非法的
暂时想到这些,记到这里,后续再慢慢补充。