JQuery 對 Select option 的操作

下拉框：

           <select id="selectID" > 
          
        <option value="1">1</option> 
          
        <option value="2">2</option> 
          
        <option value="3">3</option> 
          
        <option value="4">4</option> 
          
        <option value="5">5</option> 
          
        <option value="6">6</option> 
          
    </select> 
         

 

 

 下面是對下拉框的基本操作：

 

           <script language="javascript"> 
          
        $(document).ready(function() { 
          
        //綁定下拉框change事件，當下來框改變時調用 SelectChange()方法 
          
        $("#selectID").change(function() { SelectChange(); });  
          
        }) 
          
        function SelectChange() { 
          
        //獲取下拉框選中項的text屬性值 
          
        var selectText = $("#selectID").find("option:selected").text(); 
          
        alert(selectText); 
          
        //獲取下拉框選中項的value屬性值 
          
        var selectValue = $("#selectID").val(); 
          
        alert(selectValue); 
          
        //獲取下拉框選中項的index屬性值 
          
        var selectIndex = $("#selectID").get(0).selectedIndex; 
          
        alert(selectIndex); 
          
        ////獲取下拉框最大的index屬性值 
          
        var selectMaxIndex = $("#selectID option:last").attr("index"); 
          
        alert(selectMaxIndex); 
          
    } 
          
 
          
    function aa() { 
          
        //設置下拉框index屬性為5的選項 選中 
          
        $("#selectID").get(0).selectedIndex = 5;   
          
    } 
          
    function bb() { 
          
        //設置下拉框value屬性為4的選項 選中 
          
        $("#selectID").val(4); 
          
    } 
          
    function cc() { 
          
        //設置下拉框text屬性為5的選項 選中 
          
         $("#selectID option[text=5]").attr("selected", "selected"); 
         

         $("#yyt option:contains(' 5')").attr("selected", true);

               } 
          
    function dd() { 
          
        //在下拉框最后添加一個選項 
          
        $("#selectID").append("<option value='7'>7</option>"); 
          
    } 
          
    function ee() { 
          
        //在下拉框最前添加一個選項 
          
        $("#selectID").prepend("<option value='0'>0</option>") 
          
    } 
          
    function ff() { 
          
        //移除下拉框最后一個選項 
          
        $("#selectID option:last").remove(); 
          
    } 
          
 
          
    function gg() { 
          
        //移除下拉框 index屬性為1的選項 
          
        $("#selectID option[index=1]").remove(); 
          
    } 
          
 
          
    function hh() { 
          
        //移除下拉框 value屬性為4的選項 
          
        $("#selectID option[value=4]").remove(); 
          
    } 
          
    function ii() { 
          
        //移除下拉框 text屬性為5的選項 
          
        $("#selectID option[text=5]").remove(); 
          
    }     
          
    </script>