jquery获得select option的值和对select option的操作


1、jQuery获取Select元素,并选择的Text和Value:

1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发
2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text
3. var checkValue=$("#select_id").val(); //获取Select选择的Value
4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值
5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值

2、jQuery获取Select元素,并设置的 Text和Value:
实例分析:
1. $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中
2. $("#select_id ").val(4); // 设置Select的Value值为4的项选中
3. $("#select_id option[text=‘jQuery‘]").attr("selected", true); //设置Select的Text值为jQuery的项选中

3、jQuery添加/删除Select元素的Option项:
实例分析:
1. $("#select_id").append("<option value=‘Value‘>Text</option>"); //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value=‘0‘>请选择</option>"); //为Select插入一个Option(第一个位置)
3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
4. $("#select_id option[index=‘0‘]").remove(); //删除Select中索引值为0的Option(第一个)
5. $("#select_id option[value=‘3‘]").remove(); //删除Select中Value=‘3‘的Option
6. $("#select_id option[text=‘4‘]").remove(); //删除Select中Text=‘4‘的Option

三级分类:
<select name="thirdLevel" id="thirdLevel" onchange="getFourthLevel()">
<option value="0" id="thirdOption">
  请选择三级分类
</option>
</select>
</div>

四级分类:
<select name="fourthLevelId" id="fourthLevelId">
<option value="0" id="fourthOption">
  请选择四级分类
</option>
</select>

</div>

.if($("#thirdLevel").val()!=0){
  $("#thirdLevel option[value!=0]").remove();
}

if($("#fourthLevelId").val()!=0){
  $("#fourthLevelId option[value!=0]").remove();
}//这个表示:假如我们希望当选择选择第三类时:如果第四类中有数据则删除,如果没有数据第四类的商品中的为默认值。在后面学习了AJAX技术后经常会使用到!

获取Select :
  获取select 选中的 text : $("#ddlRegType").find("option:selected").text();
  获取select选中的 value : $("#ddlRegType ").val();
 获取select选中的索引 : $("#ddlRegType ").get(0).selectedIndex;

设置select:
  设置select 选中的索引 : $("#ddlRegType ").get(0).selectedIndex=index;//index为索引值
  设置select 选中的value :
$("#ddlRegType ").attr("value","Normal“);

$("#ddlRegType ").val("Normal");

$("#ddlRegType ").get(0).value = value;

设置select 选中的text:
var count=$("#ddlRegType option").length;
for(var i=0;i<count;i++) {
   if($("#ddlRegType ").get(0).options[i].text == text){
  $("#ddlRegType ").get(0).options[i].selected = true;
  break;
 }
}
$("#select_id option[text=‘jQuery‘]").attr("selected", true);

设置select option项:

$("#select_id").append("<option value=‘Value‘>Text</option>"); //添加一项option
$("#select_id").prepend("<option value=‘0‘>请选择</option>"); //在前面插入一项option
$("#select_id option:last").remove(); //删除索引值最大的Option
$("#select_id option[index=‘0‘]").remove();//删除索引值为0的Option
$("#select_id option[value=‘3‘]").remove(); //删除值为3的Option
$("#select_id option[text=‘4‘]").remove(); //删除TEXT值为4的Option

清空 Select : $("#ddlRegType ").empty();

jquery获得值:
  .val()
  .text()

设置值: .val(‘在这里设置值‘):

$("document").ready(function(){
  $("#btn1").click(function(){
    $("[name=‘checkbox‘]").attr("checked",‘true‘);//全选
  })

  $("#btn2").click(function(){
    $("[name=‘checkbox‘]").removeAttr("checked");//取消全选
  })

  $("#btn3").click(function(){
    $("[name=‘checkbox‘]:even").attr("checked",‘true‘);//选中所有奇数
  })

  $("#btn4").click(function(){
    $("[name=‘checkbox‘]").each(function(){//反选
      if($(this).attr("checked")){
        $(this).removeAttr("checked");
      }else{
        $(this).attr("checked",‘true‘);
      }
    })
  })

  $("#btn5").click(function(){//输出选中的值
    var str="";
    $("[name=‘checkbox‘][checked]").each(function(){
      str+=$(this).val()+"\r\n";
      //alert($(this).val());
    })
    alert(str);
  })
})

jquery获得select option的值和对select option的操作,码迷,mamicode.com

时间: 2024-08-03 15:43:18

jquery获得select option的值和对select option的操作的相关文章

jquery获得select option的值 和对select option的操作

jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发 2. var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text 3. var checkValue=$("#sele

jquery获得select option的值 和对select option的操作【转藏】

获取Select : 获取select 选中的 text : $("#ddlRegType").find("option:selected").text(); 获取select选中的 value: $("#ddlRegType ").val(); 获取select选中的索引: $("#ddlRegType ").get(0).selectedIndex; 设置select: 设置select 选中的索引: $("#d

Jquery操作select,左右移动,双击移动 取到所有option的值

$(function () { function MoveItem(fromId, toId) { $("#" + fromId + " option:selected").each(function () { $(this).appendTo($("#" + toId + ":not(:has(option[value=" + $(this).val() + "]))")); }); $("#&

jquery获得option的值和对option进行操作

jQuery获取Select元素,并选择的Text和Value: 复制代码 代码如下: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text var checkValue=$("#selec

JavaScript or jQuery 获取option value值 以及文本内容的方法

1.html <div class="form-group"> <label>保险公司</label> <select class="form-control" id="testSelect"> <option value="平安">平安保险</option> <option value="太平洋">太平洋保险</op

jquery新增,删除 ,修改,清空select中的option

jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selected").text(); //获取Select选择的Text 2. var checkValue=jQuery("#select_id").val(); //获取Select选择的option Value 3. var checkIndex=jQuery("#sele

jquery 获取,设置选中值

每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selector"></select> 1.设置value为pxx的项选中 $(".selector").val("pxx"); 2.设置text为pxx的项选中 $(".selector").find("option[text='pxx']").attr(&qu

IE8下Jquery获取select选中的值的问题

我们一般使用jquery获取select时,一般这么用: <select id='a'>     <option selected='selected' value='1'> </select> var selectedValue = $("#a").val(); 在非IE8下,selectedValue的值为"1",typeof selectedValue 为"string". 在IE8下,selectedV

jquery获取select选中的值并对另一个select禁用启用

误区: 一直以为jQuery获取select中option被选中的文本值,是这样写的: $("#s").text();  //获取所有option的文本值 实际上应该这样: $("#s option:selected").text();  //获取选中的option的文本值 获取select中option的被选中的value值, $("#s").val(); $("#s option:selected").val(); js获