使用jQuery UI Draggable,如何在使用滚动条时避免拖动?

时间:2012-01-09 18:24:16

标签: javascript jquery jquery-ui modal-dialog draggable

很久以前我在我的应用程序中创建了一个对话框。对话框非常简单,位置绝对,通过javascript在屏幕中居中。

现在我已经将jQuery UI添加到应用程序中,但我不想仅仅因为它们的工作方式不同而使用jQuery UI的对话框。但我确实使用jQuery UI使我的对话框可以拖动,因为它非常简单:

$('#dialog').draggable();

有一个问题,我的一些对话框有滚动条 但是使用可拖动的方法,如果有滚动条,则会因为拖动对话框而导致错误。

使用滚动条时,是否有一种方法可以不拖动对话框? 我注意到有一些方法可以避免拖动元素,但滚动条不是元素。

谢谢

编辑:JSFiddle:http://jsfiddle.net/FGXnR/

1 个答案:

答案 0 :(得分:13)

作为一种解决方法,您可以尝试使用handle option,并且只能通过不可滚动的部分使对话框可拖动。 (标题或其他一些。)

jsFiddle Example

@AlexFigueiredo指出的另一个解决方案只涉及处理大小调整和滚动的wrapping the content / handle in a div - 这似乎阻止了将click事件发送到句柄。