JSFiddle - React, Tailwind, and code Playground

by André Albson

HTML

<select id="myoptions" size="5">
  <option id="one">Option 1</option>
  <option id="two">Option 2</option>
  <option id="three">Option 3</option>
  <option id="four">Option 4</option>
  <option id="five">Option 5</option>
  <option id="six">Option 6</option>
  <option id="seven">Option 7</option>
</select>

JavaScript

var chg = 0; // global to unselect
$("#myoptions").on({
  mousedown : function(){
   chg = 0;
 },
 change : function() {
    chg = 1;
 },
 click: function() {
   if (chg !== 1) {
   alert('o');
   $("#myoptions")[0].selectedIndex = -1;
   }
 }
});