HTML&；JavaScript代码在联机HTML编辑器上工作，但不在本地计算机上工作

我正在尝试创建一个选择菜单，允许用户通过键入或从列表中选择一个选项。该代码用于在线编辑器，如（JSfiddle）。问题是，当我尝试使用Chrome或Firefox在本地机器上打开选择列表时，它无法按预期工作

以下是我在在线编辑器（select.HTML）上使用的HTML代码：

然而，我得到了一个普通的列表，它直接在我的本地机器上显示所有选项，并且没有供用户输入的文本框

---

如有任何建议，将不胜感激。谢谢：）

检查

中的文件路径。可能是select.js，您的html文件不在同一文件夹中。

在select.js中加载文档后，您需要运行脚本。另外，检查JSFIDLE上的配置，了解脚本的运行方式

附上你的js代码如下

$( document ).ready(function() {
    /* your entire js code goes here */
});

---

查看开发工具的网络面板，以确保正在加载脚本。或者在脚本顶部添加一个

console.log（'test123'）

。也有可能代码是在jQuery加载之前运行的Chrome或Firefox控制台错误如何？是的，它在控制台内打印出“test123”，这意味着它链接正确。没有控制台错误您期望的行为是什么？尝试在关闭body tag之前放置

。是的，我检查了，并在日志中打印了一条消息，它被输出到控制台上。在将它与您提供的内容一起封装后，它现在正在工作。：）我以前试过，但最后没有分号。谢谢

<script src="select.js"></script>

/* jshint esnext: true */
$("#test").select2();

optgroupState = {};

$("body").on('click', '.select2-container--open .select2-results__group', function() {
  $(this).siblings().toggle();
  id = $(this).closest('.select2-results__options').attr('id');
  index = $('.select2-results__group').index(this);
  optgroupState[id][index] = !optgroupState[id][index];
});

$('#test').on('select2:open', function() {
  $('.select2-dropdown--below').css('opacity', 0);
  setTimeout(() => {
    groups = $('.select2-container--open .select2-results__group');
    id = $('.select2-results__options').attr('id');
    if (!optgroupState[id]) {
      optgroupState[id] = {};
    }
    $.each(groups, (index, v) => {
      optgroupState[id][index] = optgroupState[id][index] || false;
      optgroupState[id][index] ? $(v).siblings().show() : $(v).siblings().hide(); 
    });
    $('.select2-dropdown--below').css('opacity', 1);
  }, 0);
});

$( document ).ready(function() {
    /* your entire js code goes here */
});