动态设置 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 background
to white
but the element with class ui-widget-overlay
doesnot exist at that time in the DOM.
您设置background
为,white
但ui-widget-overlay
当时在 DOM 中不存在具有 class 的元素。
It works with CSS
as whenever class ui-widget-overlay
is in DOM css rules will work.
它与CSS
作为每当类 ui-widget-overlay
是DOM CSS规则将起作用。
But using .css()
in jQuery
puts inline styling
so if the element is not present in DOM than no inline styling
can be added.
但是使用.css()
in jQuery
putsinline styling
所以如果元素不存在于 DOM 中,inline styling
则可以添加no 。
Solution
解决方案
After the Dialog is open you can perform this code as class ui-widget-overlay
exists 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-overlay
doesn't exist at that point in your code, so I moved it.
ui-widget-overlay
那时您的代码中不存在,所以我移动了它。