Chrome和Safari中的jQuery UI对话框的滚动条问题

Question

我正在使用jQuery UI对话框modal=true.在Chrome和Safari中,这会通过滚动条和光标键禁用滚动(使用鼠标滚轮滚动和向上/向下翻页仍然有效).

如果对话框太高而无法放在一个页面上,则会出现问题 - 笔记本电脑上的用户会感到沮丧.

有人在三个月前在jQuery bug跟踪器上提出了这个问题 - http://dev.jqueryui.com/ticket/4671 - 它看起来不像修复它是一个优先事项.:)

任何人都这样:

1. 对此有所解决？
2. 有一个建议的解决方案,将提供一个体面的可用性体验？

我正在尝试使用鼠标悬停/滚动到表单的位,但它不是一个很好的解决方案:(

编辑:道具给Rowan Beentje(谁没有在SO afaict)寻找解决方案.jQuery UI通过捕获mouseup/mousedown事件来阻止滚动.所以下面的代码似乎解决了它:

$("dialogId").dialog({
    open: function(event, ui) {
        window.setTimeout(function() {
            jQuery(document).unbind('mousedown.dialog-overlay')
                            .unbind('mouseup.dialog-overlay');
        }, 100);
    },
    modal: true
});

使用风险自负,我不知道其他非模态行为解除了这个东西可能允许的范围.

Answer 1

您可以使用以下代码:jquery.ui.dialog.patch.js

它解决了我的问题.希望这是您正在寻找的解决方案.

Answer 2

我同意以前的海报,如果对话框不适合你,重新考虑你的设计可能会很好.但是,我可以提出一个建议.

你能把对话框内容放在一个可滚动的div中吗？这样而不是整个页面需要滚动,只需要div内的内容滚动.这种解决方法也应该很容易实现.