Home  >  Article  >  Web Front-end  >  A complete collection of Javascript operation select methods [add, modify, delete, select, clear, determine existence, etc.]_Form special effects

A complete collection of Javascript operation select methods [add, modify, delete, select, clear, determine existence, etc.]_Form special effects

WBOY
WBOYOriginal
2016-05-16 19:00:221299browse

js code
// 1. Determine whether there is an Item with Value="paraValue" in the select option
function jsSelectIsExitItem(objSelect, objItemValue) {
var isExit = false;
for (var i = 0; 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 it 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 it exists
if (jsSelectIsExitItem(objSelect, objItemValue)) {
for ( var i = 0; i if (objSelect.options[i].value == objItemValue) {
objSelect.options.remove(i);
break ;
}
}
alert("Deleted successfully");
} else {
alert("This item does not exist in the selection");
}
}


// 4. Delete the selected item in the 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. Modify the text of value="paraValue" in the select option to "paraText"
function jsUpdateItemToSelect(objSelect, objItemText, objItemValue ) {
//Determine whether it exists
if (jsSelectIsExitItem(objSelect, objItemValue)) {
for (var i = 0; i if (objSelect .options[i].value == objItemValue) {
objSelect.options[i].text = objItemText;
break;
}
}
alert("Successfully modified");
} else {
alert("This item does not exist in the selection");
}
}

// 6. Set text="paraText" in the select "The first Item is selected
function jsSelectItemByValue(objSelect, objItemText) {
//Determine whether it exists
var isExit = false;
for (var i = 0; i if (objSelect.options[i].text == objItemText) {
objSelect.options[i].selected = true;
isExit = true;
break;
}
}
//Show the result
if (isExit) {
alert("Successfully selected");
} else {
alert(" This item does not exist in the selection");
}
}

// 7. Set the Item with value="paraValue" in the selection to be selected
document .all.objSelect.value = objItemValue;

// 8. Get the value of the currently selected item of select
var currSelectValue = document.all.objSelect.value;

// 9. Get the text of the currently selected item of select
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;

/// 10. Get the Index of the currently selected item of select
var currSelectIndex = document.all.objSelect.selectedIndex;

// 11. Clear the select item
document.all.objSelect.options.length = 0;

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn