Question

正如您在此链接中看到的那样， http://jsbin.com/ozapol/9，

Jquery在某些版本的IE和最新版本的Chrome上禁用滚动条。（我还没试过任何其他的......）

有没有办法让滚动条保持启用以滚动长长的对话框？

谢谢！再见

适用于Internet Explorer的不错解决方案（感谢jk。）

html {overflow-y : scroll}

Chrome的残酷解决方法（感谢jk。）

在Chrome上，JqueryUI在滚动条上劫持鼠标事件。这看起来像是上面链接中提到的错误。要删除这些绑定，您必须取消绑定事件每次创建模态对话框时：

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

最后一个例子是：http://jsbin.com/ujagov/2

错误报告的链接：

Answer 1

您可以使用以下命令启用滚动条：

html {overflow-y: scroll;}

您可以通过编程方式添加CSS，这样就不会影响网站的每个页面以及可能的设计。

并且，您可能必须取消绑定模式对话框劫持的鼠标事件：

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

请参阅Scrollbar problem with jQuery UI dialog in Chrome and Safari

Answer 2

此错误修复于jQueryUi-1.10。以下是问题http://bugs.jqueryui.com/ticket/4671的链接。

Answer 3

将以下代码添加到您的css文件中：

 .ui-dialog .ui-dialog-content {
    overflow-y: scroll;

 }
 #longdialog{
    height: 450px;

 }

溢出不起作用，因为高度设置为auto，定义容器div的特定高度

Answer 4

如果您不想或不能升级到jQuery UI 1.10，这是您的解决方案：

https://stackoverflow.com/a/7740756/354756

Jquery模式对话框禁用滚动条

4 个答案: