Js操做Select大全

判斷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的項 this

  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;  

js獲取select改變事件spa

<select id="wupin_id" name="wupin_id" onclick="saveLast()" onchange="changeForm(this.value)" >
<option value="0" selected>請選擇您要使用的設備類型</option>
<option value="001">惠普掃描儀G5590</option>
<option value="002">惠普掃描儀G2410</option>
<option value="003">惠普掃描儀G3110</option>
</select>
相關文章
相關標籤/搜索