發表者	討論內容
冷日 (冷日)	發表時間：2009/1/16 3:20
Webmaster 註冊日: 2008/2/19 來自: 發表數: 15771	[轉貼]Javascript 操作select控件大全（新增、修改、刪除、選中、清空、判斷存在等） Javascript 操作select控件大全（新增、修改、刪除、選中、清空、判斷存在等） Posted on 2007-08-08 14:56 禮拜一閱讀(16254) 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的項 js 代碼 // 1.判斷select選項中是否存在Value="paraValue"的Item function jsSelectIsExitItem(objSelect, objItemValue) { var isExit = false ; for ( var i = 0 ; i < objSelect.options.length; i ++ ) { if (objSelect.options[i].value == objItemValue) { isExit = true ; break ; } } return isExit; } // 2.向select選項中加入一個Item function jsAddItemToSelect(objSelect, objItemText, objItemValue) { // 判斷是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { alert( " 該Item的Value值已經存在 " ); } else { var varItem = new Option(objItemText, objItemValue); objSelect.options.add(varItem); alert( " 成功加入 " ); } } // 3.從select選項中刪除一個Item function jsRemoveItemFromSelect(objSelect, objItemValue) { // 判斷是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { for ( var i = 0 ; i < objSelect.options.length; i ++ ) { if (objSelect.options[i].value == objItemValue) { objSelect.options.remove(i); break ; } } alert( " 成功刪除 " ); } else { alert( " 該select中不存在該項 " ); } } // 4.刪除select中選中的項 function jsRemoveSelectedItemFromSelect(objSelect) { var length = objSelect.options.length - 1 ; for ( var i = length; i >= 0 ; i -- ) { if (objSelect[i].selected == true ) { objSelect.options[i] = null ; } } } // 5.修改select選項中 value="paraValue"的text為"paraText" function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) { // 判斷是否存在 if (jsSelectIsExitItem(objSelect, objItemValue)) { for ( var i = 0 ; i < objSelect.options.length; i ++ ) { if (objSelect.options[i].value == objItemValue) { objSelect.options[i].text = objItemText; break ; } } alert( " 成功修改 " ); } else { alert( " 該select中不存在該項 " ); } } // 6.設置select中text="paraText"的第一個Item為選中 function jsSelectItemByValue(objSelect, objItemText) { // 判斷是否存在 var isExit = false ; for ( var i = 0 ; i < objSelect.options.length; i ++ ) { if (objSelect.options[i].text == objItemText) { objSelect.options[i].selected = true ; isExit = true ; break ; } } // Show出結果 if (isExit) { alert( " 成功選中 " ); } else { alert( " 該select中不存在該項 " ); } } // 7.設置select中value="paraValue"的Item為選中 document.all.objSelect.value = objItemValue; // 8.得到select的當前選中項的value var currSelectValue = document.all.objSelect.value; // 9.得到select的當前選中項的text var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text; // 10.得到select的當前選中項的Index var currSelectIndex = document.all.objSelect.selectedIndex; // 11.清空select的項 document.all.objSelect.options.length = 0 ; 原文出處：Javascript 操作select控件大全（新增、修改、刪除、選中、清空、判斷存在等） - 成為自己比什麼都重要！
回覆