当滑块位于多图上方时，Scriptaculous 滑块手柄不会移动答案

【问题标题】：Scriptaculous Slider handle doesn't move when slider is above a multimap当滑块位于多图上方时，Scriptaculous 滑块手柄不会移动
【发布时间】：2010-02-22 12:41:04
【问题描述】：

我有一个Scriptaculous Slider 显示在Multimap 上方的模态对话框窗口中。我遇到的问题是，如果您尝试拖动它，则在此页面上滑块手柄不会移动。如果我点击滑块轨道，手柄会正确跳转到该点，然后您可以使用手柄正确拖动。

单击手柄成功注册了单击，因为我可以console.log() 滑块在该点的值。试图通过它的手柄拖动滑块只是保持记录相同的值并且手柄不会移动。

滑块在没有多重地图的任何页面上都能正常工作。

页面上没有其他 JS 框架（只有 Prototype 和 Scriptaculous）。

我真的不确定问题是否存在。如果滑块没有注册任何内容，那么地图以某种方式位于顶部或窃取点击事件是有意义的。但显然这些点击是被记录下来的。我也不明白为什么单击滑块轨道可以完全解决问题。

有人能指出我正确的方向吗（可以通过修复程序，或者自己调试问题的路径）。

我尝试过的事情：

设置句柄的 z-index。
一开始就让模态对话框可见（因为一开始它是隐藏的 - 我认为它可能与 this issue 有关，但没有帮助）。

【问题讨论】：

标签： modal-dialog slider scriptaculous multimap

【解决方案1】：

找到问题了。

Scriptaculous Slider 和 Multimap 都在定义 Array.prototype.indexOf，但方式不同。

解决方案（因为我只想要滑块上的 1 个句柄）是编辑 slider.js 并将调用更改为 this.handles.indexOf。

Index: slider.js
===================================================================
--- slider.js   (revision 1)
+++ slider.js   (working copy)
@@ -219,14 +219,14 @@
           this.offsetY = (pointer[1] - offsets[1]);
         } else {
           // find the handle (prevents issues with Safari)
-          while((this.handles.indexOf(handle) == -1) && handle.parentNode) 
+          while((this.handles[0] != handle) && handle.parentNode)
             handle = handle.parentNode;
-            
-          if (this.handles.indexOf(handle)!=-1) {
+
+          if (this.handles[0] == handle) {
             this.activeHandle    = handle;
-            this.activeHandleIdx = this.handles.indexOf(this.activeHandle);
+            this.activeHandleIdx = 0;
             this.updateStyles();
-            
+
             var offsets  = Position.cumulativeOffset(this.activeHandle);
             this.offsetX = (pointer[0] - offsets[0]);
             this.offsetY = (pointer[1] - offsets[1]);

使用此修复程序的任何人请注意：虽然此修复程序可以使 Scriptaculous Slider 和 Multimaps 可以在同一页面上协同工作，但它会使滑块上只有 1 个手柄作品。如果您尝试将其与 2 个或更多句柄一起使用，我还没有测试过会发生什么。

【讨论】：