javascript – 在没有Internet Explorer关闭框的情况下添加选项框选项？

我正在尝试构建一个带有多个下拉选择框的网页,这些选择框在首次打开框时异步加载其选项.这在Firefox下运行良好,但在Internet Explorer下不行.

以下是我想要实现的一个小例子.基本上,有一个选择框(id为“selectBox”),它只包含一个选项(“Any”).然后有一个onmousedown处理程序,在单击该框时加载其他选项.

<html>
 <head>
  <script type="text/javascript">
    function appendOption(select,option) {
      try {
        selectBox.add(option,null); // Standards compliant.
      } catch (e) {
        selectBox.add(option);      // IE only version.
      }
    }

    function loadOptions() {
      // Simulate an AJAX request that will call the
      // loadOptionsCallback function after 500ms.
      setTimeout(loadOptionsCallback,500);
    }

    function loadOptionsCallback() {
      var selectBox = document.getElementById('selectBox');
      var option = document.createElement('option');
      option.text = 'new option';
      appendOption(selectBox,option);
    }
  </script>
 </head>
 <body>
  <select id="selectBox" onm ousedown="loadOptions();">
   <option>Any</option>
  </select>
 </body>
</html>

期望的行为(Firefox所做的)是：

>用户看到一个包含“任意”的关闭选择框.
>用户单击选择框.
>将打开选择框以显示唯一选项(“任意”).
> 500ms之后(或者当AJAX调用返回时),下拉列表会扩展为包含新选项(在此示例中硬编码为“新选项”).

所以这正是Firefox所做的,这很棒.但是,在Internet Explorer中,只要在“4”中添加新选项,浏览器就会关闭选择框.选择框确实包含正确的选项,但框已关闭,要求用户单击以重新打开它.

那么,有没有人有任何建议我如何异步加载选择控件的选项而不关闭IE下拉框？

我知道我可以在单击框之前加载列表,但我正在开发的真实表单包含许多这样的选择框,它们都是相互关联的,所以如果我可以加载它对客户端和服务器都会好得多每个选项仅在需要时.

此外,如果结果是同步加载的,那么在选择框的onmousedown处理程序完成之前,IE将按预期显示完整列表 – 但是,同步加载在这里是个坏主意,因为它会在网络请求时完全“锁定”浏览器正在发生.

最后,我还尝试使用IE的click()方法在添加新选项后打开选择框,但不会重新打开选择框.

任何想法或建议将非常感谢!!

javascript – 在没有Internet Explorer关闭框的情况下添加选项框选项？

相关推荐