jquery-ui - Ember.js路由和jQuery UI Draggable mixin互相搞乱

我现在已经坚持不懈地坚持了2天，我需要一些关于如何追查这个问题根源的建议。希望有人（你，也许这么读？）有一个类似的问题，你可以提供一些帮助。

我的应用程序通过具有该名称的jQuery UI小部件可以拖动一些内容。这非常有效，直到我使用Ember的路由在应用程序中导航。刷新UI并重新生成可拖动项目内和周围的内容时会发生一些事情。

那么，会发生什么？

在对UI进行路由重绘之后，当鼠标指针位于应该在其上方拖动的图像元素上时，可拖动的div最显着不会更新它们的位置。运动也是生涩的，看起来它是由于位置没有更新，直到指针在可拖动的div之外。此外，拖动卡住了，释放鼠标按钮后div继续跟随鼠标。

我一直在为jQueryUI Mouse添加断点，jQueryUI Mouse是draggable所依赖的鼠标事件处理程序。当它检测到鼠标按下并且鼠标按下事件时断开，我看到拖动时没有注册向上事件。事实上，在路由后重新渲染div中的任何位置都不会注册向下或向上事件。

我只是不知道我可以做些什么来搞乱鼠标听众。

我一直在关注鼠洞事件兔子洞，并提出以下建议。有a closed issue on Ember.js个事件与没有冒泡到文档的事件有关，因为jQuery UI Mouse可以捕获它。所以我在所提到的位置放入一些日志行，看看发生了什么。我只登录mouseDOwn事件以避免充斥控制台。

我看到的是，在in-Ember路由导航之前，整个Ember层次结构返回一个未定义的事件管理器。在路由之后，其中一个视图返回null，立即停止冒泡。即使是Ember应用程序根目录下的ApplicationView也没有发言权，更不用说文档节点上的jQuery UI了。

原因是返回null是奇数。这是因为它正在检查的视图不在Ember保持内部的视图列表中。它显然存在于DOM中，但在某种程度上没有注册或未注册。

狩猎继续......

我跟着this SO question和the associated code on github使jQuery UI以更加集成的方式创建和销毁观察者。与此之前的重新分解工作完全相同。

使用的所有其他JavaScript库

我在那里画了一些画布，我将其删除进行测试。

我将ember应用程序直接置于正文下方，并使应用程序视图无标记＆＃34;改变和减少有问题的可拖动东西发生的深度。我甚至将整个视图级别的短路直接连接到应用视图的插座，而不是连接到子视图的插座。

我做了一些导航项目，在路由时不刷新，可拖动...他们继续在路由后继续拖动。

在同一个Rails项目中的另一个Ember应用程序中没有出现此问题（相同的css和基本html，javascript）。我在那个应用程序中制作了一些随机按钮和东西，可以拖动＆＃34;路由＆＃34;像疯了一样，他们总是继续像他们应该的那样拖延。特定于结构或UI层次结构的东西看起来会导致它。

为了确保在删除适当的UI元素时正确地拆除了东西，我一直在记录跟踪每个日志行的大量事情，以确保它看起来正确的事情发生。最新的Safari，Chrome和Firefox也是如此。

我以原型形式将此应用程序作为TangledMessOfJavascript™应用程序。它做了所有相同的事情。使用Draggable和相同的基本UI层次结构替换DOM的部分作为导航（除了一些Ember鼓励的东西）。

即使我在寻求建议，我也不想尝试从这个非平凡的应用层次结构中产生一个小提琴。我不是想偷懒。我需要一整天的时间来制作一个小提琴，因为它是一个工作应用程序，其中包含一些我认为我无法分享的东西，但主要是因为它不是一个微不足道的角色 - 关闭问题我可以做一个简单的测试用例。

我并不是在寻找一个神奇地专注于此的人......我希望得到的是关于我如何追踪这一点的一些建议。我倾向于一些胭脂事件听众或其他一些奇怪的东西。我没有找到调试此类事情的好方法。