Option selectedProperties
Option Object
Definition and Usage
The selected property sets or returns the value of the selected attribute of the option.
This property sets the current state of the option. If true, the option is selected. The initial value of this property comes from the selected attribute of the <option> element.
Syntax
Set the selected property:
optionObject.selected=true|false
Return the selected property:
optionObject.selected
Browser Support
All major browsers support the selected property.
Examples
Examples
This example can change the selected option in the drop-down list:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example(example.com)</title>
<script>
function displayResult(){
document.getElementById("orange").selected=true;
}
</script>
</head>
<body>
<form>
Choose your favorite fruit:
<select>
<option id="apple">Apple</option>
<option id="orange">Orange</option>
<option id="pineapple" selected="selected">Pineapple</option>
<option id="banana">Banana</option>
</select>
</form>
<button type="button" onclick="displayResult()">Select Orange</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Example(example.com)</title>
<script>
function displayResult(){
document.getElementById("orange").selected=true;
}
</script>
</head>
<body>
<form>
Choose your favorite fruit:
<select>
<option id="apple">Apple</option>
<option id="orange">Orange</option>
<option id="pineapple" selected="selected">Pineapple</option>
<option id="banana">Banana</option>
</select>
</form>
<button type="button" onclick="displayResult()">Select Orange</button>
</body>
</html>
Try it Yourself »
Option Object Other Extensions