每一次操作select的时候，总是要谷歌一下资料，真是太不爽了, 在这里记录一下。

公共select代码

<select id="sel"><option value="gideon">gideon</option><option value="lisha">lisha</option><option value="samuel">samuel</option><option value="nathan">nathan</option><option value="noah">noah</option><option value="ikeepstudying">ikeepstudying</option>
</select>

jQuery对select的取值

//获取第一个option的值
$('#sel option:first').val();//最后一个option的值
$('#sel option:last').val();//获取第二个option的值
$('#sel option:eq(1)').val();//获取选中的值
$('#sel').val();
$('#sel option:selected').val();//获取选中项的显示的文本值
$("#sel").find("option:selected").text();//获取select的长度
$('#sel option').length;//获取Select选中的索引值
$("#sel").get(0).selectedIndex;  //获取Select最大的索引值
$("#sel option:last").attr("index");

jQuery对select的赋值

//设置text为pxx的项选中
sel.find("option[text='nathan']").attr("selected",'selected');//设置值为2的option为选中状态
$("#sel").val(2);
$('#sel').attr('value','2');//设置最后一个option为选中
$('#sel option:last').attr('selected','selected');
$("#sel").attr('value' , $('#test option:last').val());
$("#sel").attr('value' , $('#test option').eq($('#test option').length - 1).val());//设置Select索引值为1的项选中
$("#sel ").get(0).selectedIndex=1;  //设置Select的Text值为jQuery的项选中
$("#sel option[text='jQuery']").attr("selected", true);   //设置select的value值为1时被选中
$("#sel option[value='1']").attr("selected", true);

select的事件

//为select添加事件，当选择其中一项时触发
$("#sel").change(function(){... });

jQuery操作select的方法

//为Select追加一个Option(下拉项)
$("#sel").append("<option value='Value'>Text</option>");//为Select插入一个Option(第一个位置)
$("#sel").prepend("<option value='0'>请选择</option>");//删除Select中索引值最大Option(最后一个)
$("#sel option:last").remove();  //删除Select中索引值为0的Option(第一个)
$("#sel option[index='0']").remove(); //删除Select中Value='3'的Option
$("#sel option[value='3']").remove();  //删除Select中Text='4'的Option
$("#sel option[text='4']").remove();  //循环select的option选项
$("#sel option").each(function(){if($(this).text()=="ikeepstudying"){$(this).attr("selected", true);}
});

jQuery中select联动

//select 的 联动
$(".selector1").change(function(){// 先清空第二个$(".selector2").empty();// 实际的应用中，这里的option一般都是用循环生成多个了var option = $("<option>").val(1).text("pxx");$(".selector2").append(option);
});

jQuery中select排序 ( 参看: DEMO )

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
//, attr, ordervar sortSelect = function (select, attr, order) {if(attr === 'text'){if(order === 'asc'){$(select).html($(select).children('option').sort(function (x, y) {return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;}));$(select).get(0).selectedIndex = 0;e.preventDefault();}// end ascif(order === 'desc'){$(select).html($(select).children('option').sort(function (y, x) {return $(x).text().toUpperCase() < $(y).text().toUpperCase() ? -1 : 1;}));$(select).get(0).selectedIndex = 0;e.preventDefault();}// end desc}};//, attr, order
$(document).ready(function () {$('#btnSort').click(function (e) {sortSelect('#ddlList', 'text', 'asc');}); // event listener click});
</script><select id="ddlList"><option value="3">Three</option><option value="1">One</option><option value="1">one</option><option value="1">a</option><option value="1">b</option><option value="1">A</option><option value="1">B</option><option value="0">Zero</option><option value="2">Two</option><option value="8">Eight</option>
</select>
<input type="button" id="btnSort" Value=" Sort Dropdown By Text " />

参看: DEMO

更多参考:

jQuery: 插件开发模式详解 $.extend(), $.fn, $.widget()

jQuery: 选择器(DOM,name,属性,元素)

AngularJS jQuery 共存法则

jQuery实现多条件筛选

原文: jQuery: 操作select option方法集合