Home > Developer > Web Develop
The Select drop- down box is often used in project development, especially in the context of cascading menu applications. However, for some beginners, it is still a bit difficult to get the value and text content of the dropdown box node option.
The others will not say, now I write a piece of code, a simple explanation of how to get the value of the text content, as well as the need to add comments, I hope that the drop-down box is not quite familiar with the friend has helped.
HTML code:
1 </HEAD>2 <BODY>3 4 Book Category:5 <SelectID= "S1" >6 <optionvalue= "1">Teaching class</option>7 <optionvalue= "2">Technical class</option>8 </Select>9 </BODY>Ten </HTML>
Javascrtipt Code:
1Window.onload =function(){2 3 //the node object of the drop-down box is obtained first;4 varselect = document.getElementById ("S1");5 6 //1. How do I get the currently selected value? :7 varValue =Select.value;8 9 //2. How to get the drop-down box for all option node objectsTen varOptions =select.options; One //Note: The resulting options are an array of objects A - //3. How do I get the value of option number one? for example, I want to get the value of the first option, you can: - varvalue1 = Options[0].value; the //4. How do I get the text content of option number one? for example, I want to get the text for the first option, you can: - varText1 = Options[0].text; - - //5. How do I get the index of the currently selected option? + varindex =Select.selectedindex; - + //6. How do I get the text content of the currently selected option? A //from the 2nd question, we've got all options for an array of option objects at //again from the 5th question, we get the index value of the currently selected option - //so all we have to do is to get the option currently selected with the Options[index] subscript method. - varSelectedText =Options[index].text; -}
JS how to get the value of the Select drop-down box and the text content
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
