内置滑块的jquery可拖动DIV

花了几个小时在谷歌上试了试，自己也试了试，但都没用

我正在做的是创建一个DIV并使其可拖动。并在其内部添加滑块以旋转图像。创建DIV并使其可拖动和添加滑块都是动态完成的。我所做的基本上是点击一个箭头工具，它将箭头工具克隆到一个容器中，并使其可拖动，同时添加一个滑块。结果如下所示

<div class='draggable'>
  <img src='example.gif'>
  <div class='slider'></div>
</div>

问题是滑块在DIV内是可拖动的。如何使DIV可拖动，但滑块仍能正常工作

新解决方案

---

是的，我确实找到了答案，并决定用SHIFT键做另一个旋转解决方案。我能够使用该解决方案，现在我可以在移动鼠标的同时使用SHIFT键简单地旋转图像。比滑块简单得多，效果很好

假设您使用的是jQueryUIDragable和Slider组件，这不应该是一个问题——默认情况下，这两个组件不应该相互冲突。但是，您仍然可以使用

cancel

选项明确排除滑块：

$('.draggable').draggable({
    cancel: '.slider'
});

请参阅此JSFIDLE，以获取一个简单的示例：

---

假设您正在而不是使用jQuery UI。。。好吧，在这种情况下，我建议你马上去拿它，因为编写自己的滑块和拖放组件是一项非常艰苦的工作

不过，显而易见的解决方案是使用

---

嗨，易，谢谢。我访问了您发送的链接（JSFIDLE），但滑块在DIV中不起作用。我使用的是Linux Firefox 3.6。谢谢在铬上可以很好地工作。但不是Firefox因为某种原因。@Scott Doh！我知道为什么Firefox上的演示不适合你。我忘了拿出一个

控制台.log

。我很抱歉。。。它现在应该可以工作了。允许用户在按下SHIFT键而不是滑动条的同时旋转会很酷。我会看看我是否能做到，如果我能做到，我会分享代码。我发现本教程提供了一种不同的旋转图像的方法，通读起来非常有用。。。

$('.slider').click(function(event){
    event.stopPropagation();
});