如何将jQuery UI对话框包装在div容器中? [英] How to wrap jQuery UI Dialog in a div container?

问题描述

我的Web Portlet正在部署到liferay环境，这意味着有多个jQuery CSS主题.解决多主题问题的方法是，用我自己的类包装portlet，然后将该类作为容器添加到jquery-ui css中(例如，使用.my-portlet .ui-dialog {}).

My web portlet is being deployed to the liferay environment, which means that there are multiple jQuery css themes. The way I have been solving the multiple theme issue is by wrapping my portlet with my own class and adding that class as a container to the jquery-ui css (for example, using .my-portlet .ui-dialog {}).

但是当我使用jQuery UI创建对话框时，对话框容器被赋予了类.ui-dialog，因此主题变成了liferay正在使用的任何主题.我的解决方案是使用"my-portlet"类将对话框包装在自己的div中，这将使它使用我自己的ui主题.

When I create a dialog using jQuery UI though, the dialog container is given the class .ui-dialog, so the theme becomes that of whatever theme liferay is using. My solution would be to wrap the dialog in my own div with a class of `my-portlet', which should cause it to use my own ui theme.

但是我该怎么做?使用$(#item).dialog()会自动将ui-dialog类应用为头容器.我真的不需要修改jQuery代码.

How do I do this though? Using $(#item).dialog() automatically applies the ui-dialog class as the head container. I don't really want to have to modify the jQuery code.

推荐答案

如果您没有不同的对话框，需要将其移至不同的包装器，则可以简单地使用

If you don't have different dialogs, which need to be moved to different wrappers, then you can simply use

$('.ui-dialog').appendTo('#wrapper');

这篇关于如何将jQuery UI对话框包装在div容器中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！