This article introduces you to the summary of various usages of html calling select through js code
The following is the relevant content summarized by various usages of html calling select through js code. The article tutorial mainly talks about some technologies and knowledge related to select. For more content, you are welcome to visit http://www.VeVb.com to get more latest tutorials. The following is the tutorial explanation:
This article introduces you to the summary of various usages of html calling select through js code
1) Hide and display of select:
$(selectList).style.display=$(selectList).style.display==block?none:block;
2) Select is available or not:
<select disabled=value> document.getElementById(LevelDropList).disabled = value; not available document.getElementById(LevelDropList).disabled = value; available
<html>< head>< SCRIPT LANGUAGE=JavaScript>< !--///oSelect A new option has been added at the bottom of the list function onload(){var oOption = document.createElement(OPTION);oOption.text=Ferrari;oOption.value=4;oSelect.add(oOption);} function fnChange(){oData.value+=oCars.options[oCars.selectedIndex].text + ;}//-->< /SCRIPT>< /head><body onload=onload()>< !-- Add a Select-->< !--1 uses the SELECT element to create a drop-down list box--><SELECT NAME=Cats SIZE=1>< OPTION VALUE=1>Calico< OPTION VALUE=2>Tortie< OPTION VALUE=3 SELECTED>Siamese< /SELECT><P>< !--2 The select element creates a multi-select list box by setting the SIZE and MULTIPLE tag properties. To get selected options for the multiple selection list box, you must traverse the options collection and check whether SELECTED is set to true. --><SELECT ID=oSelect NAME=Cars SIZE=3 MULTIPLE> <!--3 and multiple are set here--><OPTION VALUE=1 SELECTED>BMW< OPTION VALUE=2>Porsche< OPTION VALUE=3 SELECTED>Mercedes< /SELECT><P>< !--3 The following demonstrates the usage of Option--><SELECT ID=oCars SIZE=1 onchange=fnChange()>< OPTION VALUE=1>BMW< OPTION VALUE=1>BMW< OPTION VALUE=2>Porsche<OPTION VALUE=3 SELECTED>BENCHAN</SELECT><P>< TEXTAREA ID=oData></TEXTAREA>< /body></html>Attachment: Some Select tips
1. Dynamically create select
function createSelect(){var mySelect = document.createElement(select);mySelect.id = mySelect; document.body.appendChild(mySelect);}2. Add option option
function addOption(){//Finding object by id, var obj=document.getElementById('mySelect');//Adding an option obj.add(new Option(text, value));}3. Delete all options
function removeAll(){var obj=document.getElementById('mySelect');obj.options.length=0;}4. Delete an option option
function removeOne(){var obj=document.getElementById('mySelect');//index, To delete the sequence number of the option, here is the sequence number of the currently selected option var index=obj.selectedIndex;obj.options.remove(index);}5. Get the value of option option
var obj=document.getElementById('mySelect');var index=obj.selectedIndex; //Serial number, take the currently selected option number var val = obj.options[index].value;6. Obtain the text of option option
var obj=document.getElementById('mySelect');var index=obj.selectedIndex; //Serial number, take the currently selected option number var val = obj.options[index].text;7. Modify option option
var obj=document.getElementById('mySelect');var index=obj.selectedIndex; //Serial number, take the currently selected option var val = obj.options[index]=new Option(new text, new value);8. Delete select
function removeSelect(){var mySelect = document.getElementById(mySelect);mySelect.parentNode.removeChild(mySelect);}9. Set select optin to be input
function removeSelect(){// Dynamically add employees to the drop-down list of participants for ( var i = 0; i < json.length; i++) {var newOption = new Option(json[i].empname, json[i].empid, i);// Add employee information to the drop-down list of participants objDeal.options.add(newOption);// The Id of the customer salesperson is not empty if(empbyDealEmpId!= empbyDealEmpId!=0){//The employee id is equal to the value in the drop-down list, and the drop-down list is selected if(empbyDealEmpId==objDeal.options[i].value){//Judge this drop-down list is selected objDeal.options[i].selected=true;End. The tutorial has been finished here. Have you gained something from reading? This site also provides select-related content, welcome to continue reading.