jquery operation select (take value, set selection)
Every time you select, you always have to look through the data. It's better to sum up the data by yourself and turn here later.
For example, <select class="selector"></select>
1. Select the item that sets value to pxx
$(".selector").val("pxx"); 2. Select the item that sets text to pxx
$(".selector").find("option[text='pxx']").attr("selected",true); Here's a use of middle brackets. The equal sign in middle brackets is preceded by the attribute name without quotation marks. In many cases, the use of brackets can make logic very simple.
3. Get the value of the currently selected item
$(".selector").val(); 4. Get the text of the currently selected item
$(".selector").val(); The colon is used here, and mastering its usage can also make the code concise.
A cascade of selects is often used, i.e. the value of the second select changes with the value selected by the first select. This is very simple in jquery.
Such as:
Copy the code as follows:
$(".selector1").change(function(){
// First empty the second
Js Operation Select Complete
The code is as follows:
// 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 < 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) {
//Judgment of existence
if (jsSelectIsExitItem(objSelect, objItemValue)) {
alert("this Item Of Value Value already exists");
}
else {
var varItem = new Option(objItemText, objItemValue);
objSelect.options.add(varItem);
alert("Successful accession");
}
} // 3. Delete an Item from the select option
function jsRemoveItemFromSelect(objSelect, objItemValue) {
//Judgment of existence
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 This item does not exist");
}
}
// 4. Delete the selected item in 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) {
//Judgment of existence
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("Successful modification");
} else {
alert("this select This item does not exist");
}
} // 6. Set the first Item of text="paraText" in select to select
function jsSelectItemByValue(objSelect, objItemText) {
//Judgment of existence
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;
}var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
}// Show results if (isExit) {alert ("successful selection"); else {alert ("this selection does not exist"); and}
// 7. Set the Item of value="paraValue" in select to select
document.all.objSelect.value = objItemValue;
// 8. Get the value of the current selected item of select
var currSelectValue = document.all.objSelect.value;
// 9. Get the text of the current selected item of select
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
// 10. Get the Index of the current selected item of select
var currSelectIndex = document.all.objSelect.selectedIndex;
// 11. Empty the item of select
document.all.objSelect.options.length = 0;