动态设置 JQuery UI 模态对话框覆盖背景颜色
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19473821/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set JQuery UI modal dialog overlay background color dynamically
提问by lealam
i want change the page packground color when the modal dialog loadui-widget-overlay and property background-color
when i set it with css it Works fine
我想在模式对话框加载ui-widget-overlay和属性background-color
时更改页面packground颜色,当我用css设置它时它工作正常
.ui-widget-overlay {
background-color: white;
}
but i want change it dynamically Because i have some modal dialog and i want change it only One of them
i try use jquery but it not work
但我想动态更改它因为我有一些模态对话框,我只想更改其中一个
我尝试使用 jquery 但它不起作用
$('.ui-widget-overlay').css('background', 'white');
why?
为什么?
回答by Tushar Gupta - curioustushar
Problem with your code
你的代码有问题
$('.ui-widget-overlay').css('background', 'white');
you set backgroundto whitebut the element with class ui-widget-overlaydoesnot exist at that time in the DOM.
您设置background为,white但ui-widget-overlay当时在 DOM 中不存在具有 class 的元素。
It works with CSSas whenever class ui-widget-overlayis in DOM css rules will work.
它与CSS作为每当类 ui-widget-overlay是DOM CSS规则将起作用。
But using .css()in jQueryputs inline stylingso if the element is not present in DOM than no inline stylingcan be added.
但是使用.css()in jQueryputsinline styling所以如果元素不存在于 DOM 中,inline styling则可以添加no 。
Solution
解决方案
After the Dialog is open you can perform this code as class ui-widget-overlayexists now.
对话框打开后,您可以执行此代码,因为类ui-widget-overlay现在已经存在。
Working code
工作代码
$("#dialogDiv").dialog({
autoOpen: false,
modal: true
});
$("#btn").click(function () {
$("#dialogDiv").dialog('open');
$('.ui-widget-overlay').css('background', 'white'); //write background color change code here
});
回答by Scott Rowell
ui-widget-overlaydoesn't exist at that point in your code, so I moved it.
ui-widget-overlay那时您的代码中不存在,所以我移动了它。

