如何在jquery对话框中应用background-color css

时间:2013-05-08 09:29:35

标签: jquery

我正在运行时形成一些弹出窗口,如下所示,但我想应用背景色css如何应用它?

$("<div></div>")
                .addClass("dialog1")
                .attr("id", $(this).attr("id"))
                .appendTo("body")
               // .addCss("background-color","red")
                .dialog({
                    title: $(this).attr("data-dialog-title"),
                    close: function () { $(this).remove() },
                    width: $(this).attr("data-dialog-width"),
                    modal: true,
                    position: 'center',
                    resizable: $(this).attr("data-dialog-resizable")
                }).load(url);

                $(".close").live("click", function (e) {
                    e.preventDefault();
                    // $(this).dialog('destroy').remove();
                    $(this).closest(".dialog1").dialog("close");
                });

5 个答案:

答案 0 :(得分:3)

您可以使用css()代替addCss

.css("background-color","red")

以及live()已弃用,您应使用on()代替

答案 1 :(得分:0)

使用.css()

 $("<div></div>")
            .addClass("dialog1")
            .attr("id", $(this).attr("id"))
            .appendTo("body")
            .css("background-color","red")
            .dialog({
                title: $(this).attr("data-dialog-title"),
                close: function () { $(this).remove() },
                width: $(this).attr("data-dialog-width"),
                modal: true,
                position: 'center',
                resizable: $(this).attr("data-dialog-resizable")
            }).load(url);

并使用on()代替live()

            $(".close").on("click", function (e) {
                e.preventDefault();
                // $(this).dialog('destroy').remove();
                $(this).closest(".dialog1").dialog("close");
            });

委托它,如果你将它附加到动态生成的元素..

    $(document).on("click",".close", function (e) { //<--closest static element rather than document
                e.preventDefault();
                // $(this).dialog('destroy').remove();
                $(this).closest(".dialog1").dialog("close");
            });

答案 2 :(得分:0)

请考虑使用以下代码:

$("<div></div>")
    .addClass("dialog1")
    .attr("id", $(this).attr("id"))
    .appendTo("body")
    .css("background-color","red")
    .dialog({
            ...

重要的是.css("background-color", "red")行。

答案 3 :(得分:0)

您可以在css本身进行更改

e.g。 .ui-dialog {background:yellow}

答案 4 :(得分:0)

最简单的方法是覆盖jquery对话框背景属性,如下所示

.ui-dialog .ui-dialog-content {
        background: red;
    }