我有一个选择框,仅在单击时才应填充。涉及的查询需要很长时间,因此我将其与页面上显示的标准数据分离。
我已经实现了函数loadMyData(element, id)
,它执行ajax请求并以JSON形式返回数据。然后它会填充选择框。
事件绑定(bind)到元素,如下所示:
<select onclick="loadMyData(this, 1)">
</select>
选择框填充如下:
$.each(data, function(index, optionData) {
select.options[element.options.length]
= new Option(optionData.Text, optionData.Value);
});
在基于 Gecko 的浏览器上可以工作,但在 Webkit 浏览器(safari 和 chrome)上,当我单击选择框时,在 ajax 请求之前和响应之后会显示一个空的下拉框,该下拉框是不刷新。必须在选择框外部单击并再次单击才能看到更新的“选项”。
有什么办法可以强制刷新内容吗?或者简单地自动选择第一个并隐藏下拉框?
**尝试了 onfocus 并发现了相同的结果。 onmouseover 有效,但“不可用”。 onchange 不可行,因为选择框在其初始状态为空。*
最佳答案
一些想法:
不要使用标准 html 选择框 - 您的应用程序无论如何都不会正常降级。
使用一些点击劫持 - 在选择框上有一个透明的 div - IE 问题
使用复选框允许“非标准”答案,这将填充选择框并使其可点击(未禁用)
我最喜欢的:缓存查询结果并立即填充选择框。在选择框附近提供另一个“引用选项”按钮,以通过 AJAX 重新加载选项。
关于jquery - 单击后通过 ajax 延迟加载单个选择框选项的正确方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/921338/