1

I've below code:

HTML:

<div id="wrap">
    <select id="menu_One">
        <option>Menu One 1</option>
        <option>Menu One 2</option>
        <option>Menu One 3</option>
        <option>Menu One 4</option>
        <option>Menu One 5</option>
    </select>
    <br> <br>  <br>  <br>  <br>  <br>
    <div id="onMouserRover"></div>
    <div id="onClickEvent"></div>
</div>

JS:

var select_two = "<select id='menu_Two'>";
select_two += "<option>Menu Two 1</option>";
select_two += "<option>Menu Two 2</option>";
select_two += "<option>Menu Two 3</option>";
select_two += "<option>Menu Two 4</option>";
select_two += "</select>";

var eDeviceSelectId = document.getElementById("menu_One");
var device = eDeviceSelectId.options[eDeviceSelectId.selectedIndex].value;
var div1 = document.getElementById('onMouserRover');
var div2 = document.getElementById('onClickEvent');

/* Item selected event listener */
eDeviceSelectId.addEventListener('change', function (event) {
    device = eDeviceSelectId.options[eDeviceSelectId.selectedIndex].value;
    div2.innerHTML = device;
}, false);

setInterval(function () {
    device = eDeviceSelectId.options[eDeviceSelectId.selectedIndex].value;
    div1.innerHTML = device;
}, 2000);

Fiddle at: http://jsfiddle.net/kaushal98/8v7tw9ty/3/

When the timer runs, Firefox automatically updates eDeviceSelectId.selectedIndex based on mouse hover without clicking, i.e. if you just press and hold on the drop down item. This doesn't happen in Chrome.

Is there anyways to fix this? i.e. update the index in Firefox only after mouse is released.

Thanks

Update 1: Why it's not a duplicate question!

I don't think it's a duplicate question. Even though the duplicate link has definitely some relevance, there is no answer there which solves my issue here. e.g. Here's a modified another fiddle (based on the fiddle linked in the duplicate link) to run in FF. I am using FF 34. http://jsfiddle.net/kaushal98/BRLT9/52/

When the timer expires, whatever dropdown option the mouse is hovering over, it's value is printed. This won't happen in Chrome. Chrome will update the value only after you click the item and then release the mouse.

kaushal
  • 785
  • 12
  • 27

0 Answers0