select的各种取值设置问题

本文是作者对前端开发中select元素属性使用的总结,针对遇到的问题进行详细阐述,旨在帮助开发者解决select取值设置时遇到的困扰。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

从写前端以来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属性,所以使用 . 或者 [属性='值']这种叫做属性选择器来获取是非法的

暂时想到这些,记到这里,后续再慢慢补充。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值