How to Get the Selected Value and Text from a Dropdown List Using JavaScript?

Getting Selected Value from Dropdown List Using JavaScript

Selecting values from a dropdown list is a common task in web development. JavaScript provides a straightforward method to retrieve the selected value using the value property of the element.

Consider the following dropdown list:

<form>
  <select>

To get the selected value, simply use the following JavaScript code:

var e = document.getElementById("ddlViewBy");
var value = e.value;

This will assign the value of the selected option (e.g., "2") to the value variable.

In addition to the value, you can also retrieve the text displayed in the selected option:

var text = e.options[e.selectedIndex].text;

This will assign the text of the selected option (e.g., "test2") to the text variable.

By utilizing these techniques, you can easily retrieve the selected value and text from a dropdown list in JavaScript.

The above is the detailed content of How to Get the Selected Value and Text from a Dropdown List Using JavaScript?. For more information, please follow other related articles on the PHP Chinese website!

JavaScript select using Property this

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

Previous article：Does JavaScript Have a Built-in RegExp Escape Function?Next article：Does JavaScript Have a Built-in RegExp Escape Function?

Related articles

See more

• An in-depth analysis of the Bootstrap list group component
• Detailed explanation of JavaScript function currying
• Complete example of JS password generation and strength detection (with demo source code download)
• Angularjs integrates WeChat UI (weui)
• How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills

Public welfare online PHP training，Help PHP learners grow quickly！

About usDisclaimerSitemap

© php.cn All rights reserved