У меня есть следующая разметка:
<select onchange="jsFunction()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Когда пользователь вытаскивает комбобокс и выбирает ту же опцию, которая была ранее выбрана (или вообще не изменяет выделение), JavaScript не считает это событием onchange. Таким образом, jsFunction() не вызывается. Но я хочу, чтобы jsFunction() вызывал даже в этом случае. Как я могу достичь этого?
Я бы сделал это вот так:
<select onchange="jsFunction()">
<option value="" disabled selected style="display:none;">Label</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Если вы хотите, чтобы у вас была такая же метка, как и первая опция, которая в этом случае равна 1. Еще лучше: поставьте там ярлык для выбора в поле.
Вы должны добавить пустую опцию для ее решения,
Я также могу дать вам еще одно решение, но это зависит от вас, что подходит вам или нет. Поскольку пользователь выбирает вариант по умолчанию после выбора других опций, чем jsFunction будет вызываться дважды.
<select onChange="jsFunction()" id="selectOpt">
<option value="1" onclick="jsFunction()">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
function jsFunction(){
var myselect = document.getElementById("selectOpt");
alert(myselect.options[myselect.selectedIndex].value);
}
Это работает:
<select name="type" onmousedown="this.value='';" onchange="alert('Changed.');">
<option value='1'>One</option>
<option value='2'>Two</option>
<option value='3'>Three</option>
<option value='4'>Four</option>
<option value='5'>Five</option>
<option value='6'>Six</option>
<option value='7'>Seven</option>
<option value='8'>Eight</option>
<option value='9'>Nine</option>
<option value='10'>Ten</option>
</select>
используйте свойство "onmouseup" с каждым элементом параметра. он многословный, но должен работать. также, в зависимости от того, что делает ваша функция на самом деле, вы можете упорядочить вещи несколько иначе, считая, что число важно в обработчике:
<select>
<option onmouseup="handler()" value="1">1</option> //get selected element in handler
<option onmouseup="handler(2)" value="2">2</option> //explicitly send the value as argument
<option onmouseup="handler(this.value)" value="3">3</option> //same as above, but using the element value property and allowing for dynamic option value. you could also send "this.innerHTML" or "this.textContent" to the handler, making option value unnecessary
</select>
Код JavaScript:
Единственный недостаток заключается в том, что когда пользователь нажимает на раскрывающийся список, текущий выбранный элемент не отображается выбранным
Просто установите selectIndex связанного тега <select> на -1 в качестве последнего шага вашего события обработки.
mySelect = document.getElementById("idlist");
mySelect.selectedIndex = -1;
Он работает каждый раз, удаляя подсветку и позволяя вам снова выбрать один и тот же (или другой) элемент.
Попробуйте это. Просто добавьте пустой вариант. Это решит вашу проблему.
<select onchange="jsFunction()">
<option></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Он не срабатывает, потому что значение не "изменилось". Это то же значение. К сожалению, вы не можете достичь желаемого поведения с помощью события change.
Вы можете обрабатывать событие blur и выполнять любую необходимую обработку, когда пользователь покидает поле выбора. Таким образом, вы можете запустить код, который вам нужен, даже если пользователь выбирает одно и то же значение.
Как это.
1st является "пустым".
<option></option>
<option>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
<option>06</option>
<option>07</option>
<option>08</option>
<option>09</option>
<option>10</option>
<option>11</option>
<option>12</option>