深究JavaScriptIT干货javascript基础学习

JQuery和JS—操作select

2018-04-03  本文已影响22人  _Janly
<select name="sort" id="sort">
    <option value="desc">按日期倒序</option>
    <option value="asc">按日期正序</option>
</select>

JQuery部分

1.根据value设置选中

$("#sort").val("asc")

2.根据text设置选中

$("#sort").find("option[text=按日期正序]").attr("selected",true);

3.获取选中项的value

$("#sort").val()

4.获取选中项的text

$("#sort").find("option:selected").text();
或
$("#sort option:selected").text();

5.改变选项,进行相应操作(多用于级联)

$("#sort").change(function(){
      //   操作
})

6.判断是否被选中

$("option[value=desc]").is(':checked') //true为被选中,false未被选中
$("option[value=desc]").attr('selected')!=undefined  //true为被选中,false未被选中

7.获取select选中的索引

$("#sort").get(0).selectedIndex  //下表从0开始

8.添加option

$("#sort").append("<option  value=" + value + ">" + text + "</option>");
var   mySelect = document.getElementById("sort");//定位id(获取select)
var   index =mySelect.selectedIndex;// 选中索引(选取select中option选中的第几个)
var   text =mySelect.options[index].text; // 选中文本
var   value =mySelect.options[index].value; // 选中值
mySelect.options[index].selected // 判断select中的某个option是否选中   true为选中   false 为未选中
上一篇下一篇

猜你喜欢

热点阅读