0

我在“开发”网站上有许多网站,这意味着它是虚拟数据,并非所有功能都有效。发生的情况是我的 document.ready() 中有这个函数,它应该找到弹出框的 html 并向其中添加一个类,这为弹出框提供了一个蓝色的小标题栏。功能:

$("document").ready(
function(){
    //loadSummary();
    NOT_AVAILABLE_ALERT = $("#modalMessageAlert").dialog(
            {
                position: "center",
                resizable: false,
                bgiframe: true,
                autoOpen: false,
                width: 250,
                height: 200,
                draggable: false,
                modal: true,
                close:function(event,ui){
                    },
                open:function(event,ui){
                    }
            });
   modifyModalHeader("modalMessageAlert","demo_dialog_header");
}
);

function modifyModalHeader(id,className){
var refs = $("#"+id).prev();
var ref = refs.eq(0);
ref.addClass(className);
}

function navigateDemo() {
NOT_AVAILABLE_ALERT.dialog("open");
}

HTML

<div id="tempXML" ></div>
<div id="modalMessageAlert"style="left:-200px; display:none">
    <h3>This feature is not available in this demo household.</h3>
    <input style="margin-bottom: 15px" type="button" Value="Close" onclick="NOT_AVAILABLE_ALERT.dialog('close');"/>
</div>

HTML 链接:

<input type="submit" onclick="javascript:navigateDemo();return false;" value="Save" id="save"/>

CSS

#modalMessageAlert {
background-color:#fff;
cursor:pointer;
padding: 10px 10px 10px 10px;
text-align:center;
vertical-align:middle;
}

.demo_dialog_header {
background-image:url(/backoffice/Prospects/APP360/images/demo_modal_header.gif)
}

如果我理解正确, modifyModalHeader 函数应该使用 .prev() 功能找到 tempXML div 并将该类添加到 tempXML div,然后当用户单击“提交”又名保存按钮时,它会显示对话框,对话框显示很好,只是没有引用图像作为背景图像,它只会在顶部创建一条大约 15 像素宽的实心蓝线。这种完全相同的功能和引用可以在相同目录中包含的页面上正常工作,但由于某种原因,我无法正确加载它。任何帮助是极大的赞赏。-尼克

4

1 回答 1

0

事实证明,我有冲突的样式表覆盖了类,因为我使用了一些 JQuery 日历扩展器,并且它们被引用为 ui-widgets,就像那个弹出窗口一样。

于 2013-05-09T15:50:42.847 回答