如何在jQuery UI中替换对话框头？

Question

我想在jQuery UI中删除对话框标题并添加我的关闭按钮。关闭按钮是图像，当用户单击图像时，对话框将关闭。这是我的片段：

$("#dialog-model").dialog({
    create: function (event, ui) {
        jQuery(".ui-dialog-titlebar").hide();
        $("#dialog-model").css({ 'font-family': 'Helvetica', 'padding': '0', 'font-size': '12px' });
    },
    height: 500,
    width: 900,
    modal: true,

});

我尝试在scipt中添加图片，但它不起作用

Answer 1

更新答案

试试这个吗？ DEMO http://jsfiddle.net/yeyene/GnpQ8/2/

创建自定义关闭按钮。

$(document).ready(function(){
    $("#dialog-model").dialog({
        create: function (event, ui) {
            $('.ui-dialog-titlebar').css({'background':'none','border':'none'});
            $(".ui-dialog-titlebar").html('<a href="#" role="button"><span class="myCloseIcon">close</span></a>');
            $("#dialog-model").css({ 'font-family': 'Helvetica', 'padding': '0', 'font-size': '12px' });
        },
        width: 250,
        height: 150,       
        modal: true,
        resizable: false
    });

    $("span.myCloseIcon").click(function() {
        $( "#dialog-model" ).dialog( "close" );
    });
});