Jquery 模式对话框禁用滚动条

发布于 2024-12-28 02:53:52 字数 1187 浏览 0 评论 0原文

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

Jquery 禁用某些版本的 IE 和最新版本的铬。 (我还没有尝试任何其他...)

有没有办法保持滚动条启用,以便能够滚动很长的对话框?

谢谢 ! 再见

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

错误报告链接:

  1. http://bugs.jqueryui.com/ticket/4671
  2. http://wiki.jqueryui.com/w/page/34725121/Visual-Test-Page-Cleanup

As you can see on this link,
http://jsbin.com/ozapol/9 ,

Jquery disables the scrollbars on some versions of IE and the latest version of chrome.
(I didnt try any other yet...)

Is there a way to keep scrollbars enabled to be able to scroll through a long long dialog ?

Thank you !
Bye

Nice solution for Internet Explorer (Thanks to jk.)

html {overflow-y : scroll}

Brutal workaround for Chrome (Thanks to jk.)

On Chrome, JqueryUI Hijacks mouse events on the scrollbars.
This looks like a bug that is referred in the links above.
In order to remove those bindings, you have to unbind events
each time you create a modal dialog :

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

There is the final example : http://jsbin.com/ujagov/2

Links to bug reports :

  1. http://bugs.jqueryui.com/ticket/4671
  2. http://wiki.jqueryui.com/w/page/34725121/Visual-Test-Page-Cleanup

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

酸甜透明夹心 2025-01-04 02:53:52

您可以通过以下方式保持滚动条启用:

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
});

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

You can keep scrollbars enabled with:

html {overflow-y: scroll;}

You could add that CSS programmatically so it doesn't affect every page of the site and possibly the design.

And, you may have to unbind the mouse events that the modal dialog hijacks:

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

See Scrollbar problem with jQuery UI dialog in Chrome and Safari

紫竹語嫣☆ 2025-01-04 02:53:52

此错误已在 jQueryUi-1.10 中修复。
这是问题的链接http://bugs.jqueryui.com/ticket/4671

This bug fixed at jQueryUi-1.10.
Here is link with the issue http://bugs.jqueryui.com/ticket/4671.

各自安好 2025-01-04 02:53:52

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

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

 }
 #longdialog{
    height: 450px;

 }

溢出不起作用,因为高度设置为自动,请为容器 div 定义特定高度

Add following code to your css-file:

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

 }
 #longdialog{
    height: 450px;

 }

The overflow doesn't work because the height was set to auto, define a specific height to the container div

橪书 2025-01-04 02:53:52

如果您不想或无法升级到 jQuery UI 1.10,这就是适合您的解决方案:

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

If you don't want to or can't upgrade to jQuery UI 1.10, this is the solution for you:

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

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文