JQuery Autocomplete 与 IE7 的兼容性

Posted 2023-05-08

【中文标题】JQuery Autocomplete 与 IE7 的兼容性

【英文标题】：JQuery Autocomplete's compatibility with IE7

【发布时间】：2020-11-10 19:16:58

【问题描述】：

所以我有这段代码，它所做的只是通过根据可用选项列表提供建议来自动完成用户输入的内容。

为了做到这一点，我目前正在使用带有 jquery ui 自动完成功能的 jQuery。 但是，它适用于 chrome、firefox、IE11，但不适用于 IE7。我认为 IE7 已经很老了，应该被认为已经过时了，但是该软件的最终客户端使用的是 IE7，所以对我来说是的遗憾。

这里是 jQuery 脚本：

var data = [
  
    label: "Apple",
    value: 1
  ,
  
    label: "Microsoft",
    value: 2
  ,
  
    label: "Amazon",
    value: 3
  
];

$("#companyName").autocomplete(
  source: data, 
  delay: 0, 
  autofocus: true,
  minLength: 1,
  focus: function( event, ui ) 
      $("#companyName").val( ui.item.label );
      return false;
  ,
  select: function( event, ui ) 
      $("#companyName").val(ui.item.label);
      $(".companyID").val(ui.item.value);
      $("#companyIDText").text(ui.item.value);
      return false;
  
);

这里是JSFiddle，只是为了快速检查它是否真的有效。

问题是我无法真正弄清楚 IE7 无法支持的部分。谁能帮帮我？

SN：我也坚持使用 html 4，如果这样可以提示它为什么不起作用

编辑：所以我在 IE7 上看到的实际上什么都没有：我输入并没有弹出任何内容，而它应该开始给出建议，即使只需单击输入文本框。无论如何，控制台都没有显示任何错误。我真正觉得需要指出的是，在打开开发者工具（当然是 IE 的工具）的情况下加载页面实际上可以正常工作。而且开发者工具工具栏上显示的兼容性还是7，所以我现在比以前更迷茫

对象数组是正确构建的，在控制台上打印它会正确显示构建的数组以及我期望的样子。所以我把它剥离成一个字符串数组（而不是对象），并取消了自动完成小部件的“焦点”和“选择”选项，但是仍然没有，任何一种方式都没有弹出。

这是我为了让它工作而导入的所有东西（除了 IE7 之外的所有地方）：

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script>

【问题讨论】：

欢迎来到 Stack Overflow。您没有包括什么不起作用，或者您在 IE7 中看到的具体内容。还包括您正在使用的确切 Jquery 和 jQuery UI 版本。您在控制台中看到了什么？

是的，很抱歉...我刚刚添加了所有正确的信息

这里没有这么旧的操作系统，所以我在 IE7 仿真中尝试了您的代码，它可以正常工作：i.stack.imgur.com/HyKm3.png。您可以检查是否已将该站点添加到兼容性视图中，这可能会导致一些问题。此外，您可以尝试下载 Twisty 所说的 jQuery 版本，看看它是否有效。可能 jQuery 版本对 IE7 来说太高了。

【参考方案1】：

所以我怀疑各种版本存在问题。我看到您正在使用 jQuery UI 1.12.1 中的样式表，这可能适用于 jQuery UI 1.8，也可能不适用。

我建议如下：

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

示例：https://api.jqueryui.com/1.11/autocomplete/#entry-examples

测试：https://jsfiddle.net/Twisty/gdeqm2c8/2/

您的其余代码似乎是正确的。我怀疑 UI 或 CSS 调用了一些不可用的东西。

来自jQuery UI 1.11 Release notes：

停止支持 IE7

自此版本起，我们不再接受针对 IE7 问题的错误报告。我们还从我们的测试基础架构中删除了 IE7。 IE7 的解决方法仍然存在于代码中，但我们将在 jQuery UI 1.12 中删除它们。

【讨论】：

简直太棒了。谢谢这真的为我解决了。它一定是一个 IE7 错误，以前版本的 jQuery 有一个解决方法。救生员！