HTML select元素onchange触发已经选择的选项 [英] HTML select element onchange trigger for already selected option
问题描述
我有以下包含下拉列表的HTML（单选）
< script type =text / javascript >
$（document）.ready（function（）{
$（＃garden）。bind（'change'，function（）{
alert（Changed）;
}）;
}）;
< / script>
< body>
< div id =content>
< select id =garden>
< option value =flowers>鲜花< / option>
< option value =灌木>灌木< / option>
< option value =trees> Trees< / option>
< option value =灌木丛>灌木丛< / option>
< / select>
< / div>
< / body>
< / html>
当HTML页面呈现时， Flowers 是默认下拉列表中已经选择的元素（是第一个）。如果我选择任何其他值（Flowers除外），则会触发javascript函数并显示一个包含Changed的提示框。
Q1：如果我再次重新选择 Flowers ，则不会触发 onchange 事件。我明白这是因为下拉列表中没有任何内容被更改。有没有一种方法可以触发一个函数，即使在下拉菜单中没有改变已经选择的值？
Q2：如何提取元素的值刚刚被选中（即使没有新的选择 - 也就是说，用户点击下拉菜单，只需点击其他地方）。
我已经尝试了 onblur，但要求用户单击文档的其他位置，以便下拉失去焦点。任何帮助将非常感激。
非常感谢。
[为了简洁起见，我编辑了HTML标头和其他包含在代码片段中的脚本包含内容。]
-
将点击事件处理程序绑定到
选择$（ #garden）。bind（'click'，function（）{
alert（$（this）.find（'option：selected'）。text（））;
}）;
-
绑定
focusout$（＃garden）。bind（'focusout'，function（）{
alert（$这个）.find（'option：selected'）。text（））;
}）;
当然会绑定更改您已经拥有的事件处理程序。 点击事件处理程序可能有点棘手，因为每次单击元素时它都会触发。但是如果你不是 alert（），它每次都不应该成为一个问题，你得到了当前的选择，并且可以用它做任何你想要的。 p>
I have the following HTML containing a drop down list (single selection)
<script type="text/javascript">
$(document).ready(function () {
$("#garden").bind('change', function() {
alert("Changed");
});
});
</script>
<body>
<div id="content">
<select id="garden">
<option value="flowers">Flowers</option>
<option value="shrubs">Shrubs</option>
<option value="trees">Trees</option>
<option value="bushes">Bushes</option>
</select>
</div>
</body>
</html>
When the HTML page is rendered, Flowers is the already selected element in the drop-down by default (being the first one). If I select any other value (other than "Flowers"), the javascript function is fired and a alert box containing "Changed" is shown.
Q1: But, in case I re-select Flowers again, the onchange event is not triggered. I understand it is because nothing was 'changed' in the drop-down list. Is there a way a function is triggered even when no change to the already selected value in drop-down is done?
Q2: How to extract the value of the element which has just been selected (even if nothing new was selected - that is, user clicked on the drop down, and simply clicked somewhere else).
I have already tried the "onblur" but that requires that the user clicks somewhere else on the document so that the drop-down loses focus. Any help would be really appreciated.
Thanks a lot. [I have edited out the HTML headers and other script inclusions in the code snippet provided for brevity.]
Well I think I don't get you 100%, but some things I can suggest here are:
bind a click event handler to the
select$("#garden").bind('click', function() { alert($(this).find('option:selected').text()); });bind a
focusoutevent handler$("#garden").bind('focusout', function() { alert($(this).find('option:selected').text()); });
and of course bind the change event handler which you already got. The click event handler might be a little bit tricky since it would fire every time you click on the element. But if you don't alert() it every time it should not be a problem at all, you got the current selection and can do with it whatever you want.
这篇关于HTML select元素onchange触发已经选择的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
