Javascript 操作select控件

转自：JavaEye     原文：http://www.javaeye.com/topic/68636

判断select选项中 是否存在Value="paraValue"的Item

向select选项中 加入一个Item

从select选项中 删除一个Item

删除select中选中的项

修改select选项中 value="paraValue"的text为"paraText"

设置select中text="paraText"的第一个Item为选中

设置select中value="paraValue"的Item为选中

得到select的当前选中项的value

得到select的当前选中项的text

得到select的当前选中项的Index

清空select的项


   1.  // 1.判断select选项中 是否存在Value="paraValue"的Item       




   2. function jsSelectIsExitItem(objSelect, objItemValue) ...{       


   3.     var isExit = false;       




   4.     for (var i = 0; i < objSelect.options.length; i++) ...{       




   5.         if (objSelect.options[i].value == objItemValue) ...{       


   6.             isExit = true;       


   7.             break;       


   8.         }       


   9.     }       


  10.     return isExit;       


  11. }        


  12.   


  13. // 2.向select选项中 加入一个Item       




  14. function jsAddItemToSelect(objSelect, objItemText, objItemValue) ...{       


  15.     //判断是否存在       




  16.     if (jsSelectIsExitItem(objSelect, objItemValue)) ...{       


  17.         alert("该Item的Value值已经存在");       




  18.     } else ...{       


  19.         var varItem = new Option(objItemText, objItemValue);     


  20.         objSelect.options.add(varItem);    


  21.         alert("成功加入");    


  22.     }       


  23. }       


  24.   


  25. // 3.从select选项中 删除一个Item       




  26. function jsRemoveItemFromSelect(objSelect, objItemValue) ...{       


  27.     //判断是否存在       




  28.     if (jsSelectIsExitItem(objSelect, objItemValue)) ...{       




  29.         for (var i = 0; i < objSelect.options.length; i++) ...{       




  30.             if (objSelect.options[i].value == objItemValue) ...{       


  31.                 objSelect.options.remove(i);       


  32.                 break;       


  33.             }       


  34.         }       


  35.         alert("成功删除");       




  36.     } else ...{       


  37.         alert("该select中 不存在该项");       


  38.     }       


  39. }   


  40.   


  41.   


  42. // 4.删除select中选中的项   




  43. function jsRemoveSelectedItemFromSelect(objSelect) ...{       


  44.     var length = objSelect.options.length - 1;   




  45.     for(var i = length; i >= 0; i--)...{   




  46.         if(objSelect[i].selected == true)...{   


  47.             objSelect.options[i] = null;   


  48.         }   


  49.     }   


  50. }     


  51.   


  52. // 5.修改select选项中 value="paraValue"的text为"paraText"       




  53. function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) ...{       


  54.     //判断是否存在       




  55.     if (jsSelectIsExitItem(objSelect, objItemValue)) ...{       




  56.         for (var i = 0; i < objSelect.options.length; i++) ...{       




  57.             if (objSelect.options[i].value == objItemValue) ...{       


  58.                 objSelect.options[i].text = objItemText;       


  59.                 break;       


  60.             }       


  61.         }       


  62.         alert("成功修改");       




  63.     } else ...{       


  64.         alert("该select中 不存在该项");       


  65.     }       


  66. }       


  67.   


  68. // 6.设置select中text="paraText"的第一个Item为选中       




  69. function jsSelectItemByValue(objSelect, objItemText) ...{           


  70.     //判断是否存在       


  71.     var isExit = false;       




  72.     for (var i = 0; i < objSelect.options.length; i++) ...{       




  73.         if (objSelect.options[i].text == objItemText) ...{       


  74.             objSelect.options[i].selected = true;       


  75.             isExit = true;       


  76.             break;       


  77.         }       


  78.     }             


  79.     //Show出结果       




  80.     if (isExit) ...{       


  81.         alert("成功选中");       




  82.     } else ...{       


  83.         alert("该select中 不存在该项");       


  84.     }       


  85. }       


  86.   


  87. // 7.设置select中value="paraValue"的Item为选中   


  88. document.all.objSelect.value = objItemValue;   


  89.       


  90. // 8.得到select的当前选中项的value   


  91. var currSelectValue = document.all.objSelect.value;   


  92.       


  93. // 9.得到select的当前选中项的text   


  94. var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;   


  95.       


  96. // 10.得到select的当前选中项的Index   


  97. var currSelectIndex = document.all.objSelect.selectedIndex;   


  98.       


  99. // 11.清空select的项   


 100. document.all.objSelect.options.length = 0;