jquery操作select下拉框：取值，赋值，删除

时间：2023-03-09 06:40:18
jquery操作select下拉框：取值，赋值，删除

1.jQuery对select的取值

<select id="test">

  <option value ="1">测试1</option>

  <option value ="2">测试2</option>

  <option value="3" >测试3</option>

  <option value="4" >测试4</option>

</select>

用上面的select举例说明：

取得value: var value=$("#test").val();

取得text:    var text=$("#test").find("option:selected").text();

获取Select选择的索引值: var checkIndex=$("#test ").get(0).selectedIndex;

获取Select最大的索引值: var maxIndex=$("#test  option:last").attr("index");

2.jquery对select的赋值

jquery对select的动态赋值，动态赋值是实际项目中用的最多的,往往和下拉框的二级联动用在一起。

下面的追加option

$("#test").append("<option value='5'>测试5</option>");   //为Select追加一个Option(下拉项)

$("#test").prepend("<option value='0'>测试6</option>");   //为Select插入一个Option(第一个位置)

3.jquery对select的删除

$("#test").empty();用的最多

$("#test  option:last").remove();   //删除Select中索引值最大Option(最后一个)

$("#test  option[index='0']").remove();   //删除Select中索引值为0的Option(第一个)

$("#test  option[value='3']").remove();   //删除Select中Value='3'的Option

$("#test  option[text='4']").remove();   //删除Select中Text='4'的Option

相关文章