【问题标题】:Change jqueryui dialog color after it has been opened using jquery, not css使用jquery而不是css打开jqueryui对话框后更改它的颜色
【发布时间】:2013-01-23 18:41:35
【问题描述】:

我正在尝试更改 jqueryui 对话框打开后的背景。要求阻止我在样式表中设置它,因为背景颜色或图像对于单击链接的人来说是唯一的(背景值是从数据库中提取的)。

当我在加载对话框后运行以下 jquery 命令来更改 div 的 css 时,它什么也没做?

$("#modal_popup_website").css("background","red !important");

$("#modal_popup_website .ui-dialog-content").css("background","red !important");

$(".ui-dialog-content").css("background","red !important");

我做错了什么?

首先我初始化对话框如下:

$("#modal_popup_website").dialog({
            bgiframe: true,
            autoOpen: false,
            position: 'center',
            width: $(window).width()-30,
            minWidth: 990,
            height: 900,
            minHeight: 900,
            modal: true,
            stack: true, //Puts in front of other dialog's that may be open
            open: function(){

            },
            close: function() {
                //Save
            }

然后当用户点击这样的链接时,我会打开对话框:

$("#modal_popup_website").dialog("open");

打开后,我在对话框中输入了一些 HTML,如下所示:

$("#modal_popup_website").html('gets loaded from external file');

这是外部文件的 HTML:

<div>some text</div>
<script type="text/javascript">
   $("#modal_popup_website").css("background","red !important");
</script>

任何想法都将不胜感激!

谢谢。

【问题讨论】:

    标签: jquery jquery-ui


    【解决方案1】:

    这需要改变:

    <div>some text</div>
    <script type="text/javascript">
       $("#modal_popup_website").css("background","red !important");
    </script>
    

    收件人:

    <script type="text/javascript">
        $(document).ready(function() {
            $("#modal_popup_website").css("background","red");
        });
    </script>
    

    此链接应该会有所帮助:http://css-tricks.com/when-using-important-is-the-right-choice/

    【讨论】:

    • 感谢您的回复。不幸的是,什么都没有改变。仍然没有改变任何东西
    【解决方案2】:

    我最终以另一种方式解决了这个问题。我添加了另一个 并将其设置为 100% 宽、100% 高,并使用 css 背景来添加图像。然后我删除了 jqueryui 对话框的滚动条,只是将 overflow:auto 添加到我添加的新 div 中,它给了我所需的内容。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2012-11-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-10-31
      相关资源
      最近更新 更多