JQuery對select的操作[完整版]
如果這篇文章有幫助到,請大方的給個讚+1! |
目前的專案常常的會使用到對下拉式選單的操作,索性我就把常用到的功能記錄下來,有需要用到的朋友就參考看看吧,基本上該有的功能應該都囊括了,有新發現將不定時更新。
Select改變時的事件
$(“#SelectOption”).change(function(){ //Select事件發生 $(‘option:selected’, this).each(function(){ //alert出選到的值 alert(this.value); }); });
取得在Select中被選取的內容
$(“select[name=items]:selected”).text();
取得在Select中被選取的值
$(“select[name=items]:selected”).val();
取得在Select中被選取的Index
$(‘#SelectOption’).get(0).selectedIndex;
取得在Select中option的個數
$(“#SelectOption”).get(0).options.length;
取得在Select中最後一個的index
$(“#SelectOption option:last”).attr(“index”);
將Select中某一個option設為selected
$(“#SelectOption option[text language=”wantSelected”][/text] “).attr(“selected”, true);
替Select加入一個option
第一種方法
var newOption = “新增選項”; //設定在選單中呈現的值
$(“#SelectOption”).append(newOption); //設定選取時的值
$(newOption).attr(“value”,”選擇時的值”); //如果要預設為選取時
$(newOption).attr(“selected”,”true”); //觸發change事件
$(“#SelectOption”).trigger(“change”);
第二種方法
//加到最後面
$(“#SelectOption”).append(“Text”); //加到最前面
$(“#SelectOption”).prepend(“Text”); //移除index為0的option
$(“#SelectOption option[index=’0′]”).remove();
參考資料:
http://kevyu.blogspot.com/2008/03/jqueryselect.html
http://www.texotela.co.uk/code/jquery/select/
如果文章有幫助到您,請不吝的給本站贊助,任何的鼓勵都是分享的動力! |
|