1. Determine whether the select option contains an Item with Value = "paraValue"
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. add an Item to the select option
Function jsAddItemToSelect (objSelect, objItemText, objItemValue ){
// Determine whether the object exists
If (jsSelectIsExitItem (objSelect, objItemValue )){
Alert ("the Value of this Item already exists ");
} Else {
Var varItem = new Option (objItemText, objItemValue );
ObjSelect. options. add (varItem );
Alert ("successfully added ");
}
}
3. delete an Item from the select option
Function jsRemoveItemFromSelect (objSelect, objItemValue ){
// Determine whether the object exists
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 ("deleted successfully ");
} Else {
Alert ("this select item does not exist ");
}
}
4. Delete the selected items in the select statement.
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. Modify the text of value = "paraValue" in the select option to "paraText"
Function jsUpdateItemToSelect (objSelect, objItemText, objItemValue ){
// Determine whether the object exists
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 ("modified successfully ");
} Else {
Alert ("this select item does not exist ");
}
}
6. Set the first Item of text = "paraText" in select to be selected.
Function jsSelectItemByValue (objSelect, objItemText ){
// Determine whether the object exists
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 the result
If (isExit ){
Alert ("selected successfully ");
} Else {
Alert ("this select item does not exist ");
}
}
7. Set the Item of value = "paraValue" in select to be selected.
Document. all. objSelect. value = objItemValue;
8. Obtain the value of the selected item in the select statement.
Var currSelectValue = document. all. objSelect. value;
9. Get the text of the selected item of the select statement.
Var currSelectText = document. all. objSelect. options [document. all. objSelect. selectedIndex]. text;
10. Obtain the Index of the selected item of the select statement.
Var currSelectIndex = document. all. objSelect. selectedIndex;
11. Clear select items
Document. all. objSelect. options. length = 0;
The above is collected from the Internet. Now let's take a look at what we have done based on the above content.
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = gb2312 "/> <title> javascript select _ www.jb51.net </title> </pead> <body> <select name =" select "id =" select1 "> <option value = "1"> This is 1 </option> <option value = "2"> This is 2 </option> </select> the value is increased by 1, increase by 2, and delete option Delete select option </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]