【发布时间】：2019-07-06 14:35:33
【问题描述】：
我被迷住了。我在网页上使用了一个 select2 小部件，由 django-autocomplete-light 实现，我将一个事件监听器附加到它，如下所示：
const game_selector = $("#"+id_prefix+"game");
game_selector.on("change", switchGame);
很有魅力。我在选择框中选择了一个新游戏，然后调用了 switchGame 函数。
这是在带有manage.py runserver 的 Django 开发服务器上运行的。我可以在 Chrome 的调试器中看到这是多么的时髦：
就是这样，switchGame(event) 是处理程序。这一切也都有效。没有剧情。
但是我将代码发布到我的网络服务器，突然它不起作用。事件监听器永远不会触发。 switchGame 永远不会被调用。
它提供相同的代码，在客户端和 Chrome 的调试器中看起来相同。一切都好。我什至可以看到附加了事件侦听器，尽管顺序不同：
由开发服务器提供服务，在列表中 switchGame 上方有一个 select2 处理程序，并且从生产服务器提供服务，相同的 select2 处理程序列在 switchGame 处理程序下方。
订单重要吗？为什么顺序会不同？
最后，我正在查看上面相同的绑定代码，我可以在 switchGame 中设置一个断点，并且当我选择一个新游戏时，我可以确认由 django runserver switchGame 运行，但它是从生产服务器提供的不是。
怀疑一些 jquery 问题我什至将监听器绑定更改为：
const game_selector = $("#"+id_prefix+"game");
//game_selector.on("change", switchGame);
game_selector.get(0).addEventListener("change", switchGame);
但是行为是一样的。根据服务器上下文，Javascript 的功能如何不同？让我怀疑正在提供不同的 Javascript，但我所做的每一次检查都反对这一点，因为我可以从生产服务器进行编辑、发布和重新加载网页，并且更改的 javascript 在那里并且在 Chrome 的调试器中可见。
我想知道是否有人曾经经历过这种奇怪的行为，并且可以发表评论或建议进一步的诊断方向。
【问题讨论】：
-
你采取了哪些基本的调试步骤？例如，您是否检查过
game_selector是否实际匹配任何元素？ -
顺序重要吗？ - 是的，因为事件处理程序是在捕获阶段而不是在图像中显示的冒泡阶段捕获的。似乎也没有在服务器上加载/调用 Select2 (
select2.full.js)。看看那些事件处理程序的来源！！ -
@Pointy。是的，game_selector 匹配。至于调试步骤，我不能在这里总结，但仍然是探索性的，似乎我在自己研究 Randy 发现的绑定事件时忽略了一条重要线索！请记住，此代码都适用于一台服务器的机器上，而不是另一台服务器的另一台机器上。一个主要线索，表明它是环境和影响 JS，因此可能包含库！
-
@Randy Casburn - 出色地发现并让我走上了正轨。我忽略了 select2.full.js 中的事件处理程序完全丢失了。如果还没有解决，已经找到了可能的原因。但是开发机器有 django-autocomplete-light 3.3.2 和 production 3.3.4，我在这里发现了这个小部件的一个已知问题：github.com/yourlabs/django-autocomplete-light/issues/1079，我以前见过并忘记了......但它看起来像与 django-autocomplete-light 相关，它加载的顺序包括库！
-
碰巧这是加载 jquery 库两次的讨厌的副作用。我正在显式加载它，而我正在使用的小部件又隐式加载它。一个错误！在这里深入讨论：github.com/yourlabs/django-autocomplete-light/issues/1079 尚未修复，但解决方法是我不再显式加载 jquery！
标签： javascript html django jquery-select2 django-autocomplete-light