jquery的select元素和option的相关操作

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
     <title></title>
     <!--添加jquery-->
     <script src="../Script/jQuery/jquery-1.6.2.min.js" type="text/javascript"></script>
     <script type="text/javascript">
         $(function () {
             createSelect("addSel");
             addOption("addSel", "first", "第一个数据");
             addOption("addSel", "secord", "第二个数据");
             addOption("addSel", "three", "第三个数据");
             addOption("addSel", "four", "第四个数据");
             addOption("addSel", "fives", "第五个数据");
             removeOneByIndex("addSel", 0);
             removeOneByValue("addSel", "three");

             //****************以验证不可以根据text值取得option元素***********************
             //removeOneByText("addSel", "第三个数据");
             //****************以验证不可以根据text值取得option元素***********************

             //removeAll("addSel");     //删除select元素的所有options
             //removeSelect("addSel");  //删除select元素；

             setDefaultByValue("addSel", "four"); //设置option的默认值

             //添加一个option更改事件 调用自己写的方法
             $("#addSel").change(function () {
                 alert("旧文本：" + getOptionText("addSel") + "     旧Value：" + getOptionValue("addSel"));
                 editOptions("addSel", "新文本", "新Value");  //注意：不传value值的时候  value值默认为text的值
                 alert("新文本：" + getOptionText("addSel") + "     新Value：" + getOptionValue("addSel"));
             })
         })

         //动态创建带id的select
         function createSelect(id) {
             $("body").append("<select id="+id+"></select>");
         }

         //根据select的id 添加选项option
         function addOption(selectID,value,text) {
             //根据id查找select对象，
             var obj = $("#" + selectID + "");
             $("<option></option>").val(value).text(text).appendTo(obj);
         }

         //根据value的值设置options默认选中项
         function setDefaultByValue(selectID,value) {
             var obj = $("#" + selectID + "");
             obj.val(value);
         }

         //获得选中的Option Value；
         function getOptionValue(selectID) {
             //var obj = $("#" + selectID + " option:selected").val();
             //上面和下面两种都可以
             var obj = $("#" + selectID + "").find("option:selected").val();
             return obj;
         }

         //获得选中的option Text;
         function getOptionText(selectID) {
             //var obj = $("#" + selectID + " option:selected").text();
             //上面和下面两种都可以
             var obj = $("#" + selectID + "").find("option:selected").text();
             return obj;
         }

         //修改选中的option
         function editOptions(selectID, newText, newValue) {
             var obj = $("#" + selectID + "").find("option:selected");
             obj.val(newValue).text(newText);
         }

         //根据 index 值删除一个选项option
         function removeOneByIndex(selectID, index) {
             var obj = $("#" + selectID + " option[index=" + index + "]");
             obj.remove();
         }

         //根据 value值删除一个选项option
         function removeOneByValue(selectID, text) {
             var obj = $("#" + selectID + " option[value=" + text + "]");
             obj.remove();
         }

         //****************以验证不可以根据text值取得option元素***********************
         //根据text值删除一个选项option   感觉不可用  真的
         //function removeOneByText(selectID, text) {
         //var obj = $("#" + selectID + " option[text=" + text + "]");
         //obj.remove();
         //}
         //****************以验证不可以根据text值取得option元素***********************

         //删除所有选项option
         function removeAll(selectID) {
             var obj = $("#" + selectID + "");
             obj.empty();
         }

         //删除select
         function removeSelect(selectID){
             var obj = $("#" + selectID + "");
             obj.remove();
         }
     </script>
 </head>
 <body>

 </body>
 </html>
nicoollas

jquery的select元素和option的相关操作
