使用js和jquery操作select标签

前端 2018-07-20

javascript写法获取值

var obj = document.getElementById("testSelect"); //定位id
var index = obj.selectedIndex; // 选中索引
var text = obj.options[index].text; // 选中文本
var value = obj.options[index].value; // 选中值

jquery写法获取值

$('#testSelect option:selected').text();//选中的文本
$('#testSelect option:selected') .val();//选中的值
$("#testSelect ").get(0).selectedIndex;//索引
或
$("#tesetSelect").find("option:selected").text();//选中的文本
$("#tesetSelect").find("option:selected").val();//选中的值
$("#tesetSelect").find("option:selected").get(0).selectedIndex;//索引

jQuery添加/删除Select的Option项:

$("#select_id").append("Text"); //为Select追加一个Option(下拉项)
$("#select_id").prepend("请选择"); //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove(); //删除Select中Value='3'的Optiona
$("#select_id option[text='4']").remove(); //删除Select中Text='4'的Optiona

第二个select的值随着第一个select选中的值变化

$(".selector1").change(function(){
      $(".selector2").empty();
      var option=$("").val(1).text("pxx");
      $(".selector2").append(option);
});