码迷,mamicode.com
首页 > 编程语言 > 详细

转 JavaScript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)

时间:2014-09-10 12:23:40      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:os   io   java   ar   for   art   div   cti   sp   

收藏一下

1、判断select选项中 是否存在Value=”paraValue”的Item
2、向select选项中 加入一个Item
3、从select选项中 删除一个Item
4、删除select中选中的项
5、修改select选项中 value=”paraValue”的text为”paraText”
6、设置select中text=”paraText”的第一个Item为选中
7、设置select中value=”paraValue”的Item为选中
8、得到select的当前选中项的value
9、得到select的当前选中项的text
10、得到select的当前选中项的Index
11、清空select的项

 

    1. //js 代码  
    2. // 1.判断select选项中 是否存在Value="paraValue"的Item  
    3. function jsSelectIsExitItem(objSelect, objItemValue) {  
    4.     var isExit = false;  
    5.     for (var i = 0; i < objSelect.options.length; i++) {  
    6.         if (objSelect.options[i].value == objItemValue) {  
    7.             isExit = true;  
    8.             break;  
    9.         }  
    10.     }  
    11.     return isExit;  
    12. }           
    13.   
    14. // 2.向select选项中 加入一个Item  
    15. function jsAddItemToSelect(objSelect, objItemText, objItemValue) {  
    16.     //判断是否存在  
    17.     if (jsSelectIsExitItem(objSelect, objItemValue)) {  
    18.         alert("该Item的Value值已经存在");  
    19.     } else {  
    20.         var varItem = new Option(objItemText, objItemValue);  
    21.         objSelect.options.add(varItem);  
    22.         alert("成功加入");  
    23.     }  
    24. }          
    25.   
    26. // 3.从select选项中 删除一个Item  
    27. function jsRemoveItemFromSelect(objSelect, objItemValue) {  
    28.     //判断是否存在  
    29.     if (jsSelectIsExitItem(objSelect, objItemValue)) {  
    30.         for (var i = 0; i < objSelect.options.length; i++) {  
    31.             if (objSelect.options[i].value == objItemValue) {  
    32.                 objSelect.options.remove(i);  
    33.                 break;  
    34.             }  
    35.         }  
    36.         alert("成功删除");  
    37.     } else {  
    38.         alert("该select中 不存在该项");  
    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;  

转 JavaScript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)

标签:os   io   java   ar   for   art   div   cti   sp   

原文地址:http://www.cnblogs.com/jingangel/p/3964124.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!