In Internet Explorer, you can use the selectedIndex property of the <select> element to get the index of the selected option. However, for a <select multiple> element, it only gives you the index of the first selected option, not the ones clicked later.

To get the clicked option from a <select multiple> in Internet Explorer, you'll need to use a combination of event handlers and additional logic to keep track of the selected options. One approach is to use the onmousedown event to store the current state of selected options before any changes occur, and then use the onchange event to update the selected options after the click. Here's an example:

html
<select id="mySelect" multiple onmousedown="storeSelectedOptions()"> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 3</option> </select>
javascript
let selectedOptions = []; function storeSelectedOptions() { // Save the current selected options before the click selectedOptions = Array.from(document.getElementById('mySelect').selectedOptions); } document.getElementById('mySelect').onchange = function () { // Get the clicked option by comparing the previous selected options with the current ones const clickedOption = Array.from(document.getElementById('mySelect').selectedOptions).find(option => !selectedOptions.includes(option)); // Do something with the clicked option if (clickedOption) { console.log('Clicked option:', clickedOption.value, clickedOption.text); } // Update the selected options for the next click selectedOptions = Array.from(document.getElementById('mySelect').selectedOptions); };

In this example, we use the storeSelectedOptions function to store the current selected options before the click event occurs. Then, in the onchange event, we compare the previous selected options with the current ones to find the clicked option. The clicked option will be the one that is in the current selection but not in the previous selection.

Please note that this approach assumes that the user interacts with the <select multiple> using only mouse clicks. If other input methods (such as keyboard navigation) are allowed, you might need to handle those interactions separately to maintain accurate tracking of the clicked option.

Have questions or queries?
Get in Touch