The following example will display three alert messages per selected
line when you click on the button, the first alert message will display
the selected index of the list (starting from 0), the second alert
message will display the value of the value attribute of the selected option and the third alert will display the text of the selected option:
<html>
<head>
<script type='text/javascript'>
function displaySelection(obj) {
for ( var index = 0 ; index < obj.length ; index++ ) {
if ( obj.options[index].selected ) {
// display the selected index starting from 0.
alert('selected index=' + index);
// display the value of the value attribute.
alert('selected value=' + obj.options[index].value);
// display the text of the selected option.
alert('selected text=' + obj.options[index].text);
}
}
}
</script>
</head>
<body>
<select id="list">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<input type="button" value="display!"
onclick="javascript: displaySelection(document.getElementById('list'));"/>
</body>
</html>
| 
