Shr*_*rey 12 html javascript jquery select javascript-events
我有以下包含下拉列表的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">Flowers</option>
<option value="shrubs">Shrubs</option>
<option value="trees">Trees</option>
<option value="bushes">Bushes</option>
</select>
</div>
</body>
</html>
呈现HTML页面Flowers时,默认情况下是下拉列表中已选中的元素(是第一个).如果我选择任何其他值("Flowers"除外),则会触发javascript函数并显示包含"Changed"的警告框.
Q1:但是,如果我再次重新选择Flowers,onchange则不会触发事件.我理解这是因为下拉列表中没有任何"更改".是否有一种方法可以触发功能,即使在下拉列表中没有更改已选择的值时也是如此？
Q2:如何提取刚刚选择的元素的值(即使没有选择任何新元素 - 也就是说,用户单击下拉列表,只需单击其他位置).
我已经尝试了"onblur",但这需要用户点击文档上的其他位置,以便下拉菜单失去焦点.任何帮助将非常感激.
非常感谢. [为了简洁起见,我在代码段中编辑了HTML标题和其他脚本内容.]
好吧，我想我不能 100% 理解你的意思，但我可以在这里建议的一些事情是：
将单击事件处理程序绑定到select
$("#garden").bind('click', function() {
alert($(this).find('option:selected').text());
});
绑定focusout事件处理程序
$("#garden").bind('focusout', function() {
alert($(this).find('option:selected').text());
});
当然，还要绑定change您已经获得的事件处理程序。这click event handler可能有点棘手，因为每次单击该元素时它都会触发。但如果你不是alert()每次都这么做，那根本就不成问题，你得到了当前的选择，并且可以用它做你想做的任何事情。