如何在jquery dialog-extend中的标题上添加图标答案

【问题标题】：how to add icon on title in jquery dialog-extend如何在jquery dialog-extend中的标题上添加图标
【发布时间】：2014-07-28 09:07:31
【问题描述】：

我使用 jquery.dialogextend.js 2.0.0、jQuery 1.9.1 和 jQueryUI 1.10.2。

我的 jquery 对话框 js 如下：

$(function(){

    ////auto open dialog/////////////       
        //check cookie
        if( document.cookie.indexOf( "Once=true" ) < 0 ) {

        //dialog options
        var dialogOptions = {
            "title" : "title",
            "open" : function () {
                $("#open").prop("disabled",true);
                $(this).load('pop.php');
                $(this).parent().css('opacity', 0.4);
                $(this).parent().hover( function () { 
                    $(this).css('opacity', 0.9); 
                }, function (event) { 
                    $(this).css('opacity', 0.4); 
                });  
            },
            "width" : 370,
            "height" : 250,
            "dialogClass": 'dlgfixed',
            "position" : ['right bottom'], 
            "modal" : false,
            "autoOpen": true,
            "closeOnEscape" : true,
            "draggable" : true,
            "close" : function(){ 
                $(this).remove(); 
                document.cookie = "Once=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
                $("#open").prop("disabled",false);
            }
        };

        var dialogExtendOptions = {
                       "closable" : true,
                       "maximizable" : true,
                       "minimizable" : true,
     };
        // open dialog
        $("<div><div />").dialog(dialogOptions).dialogExtend(dialogExtendOptions);

  }
});

如何在标题上添加自定义图标。

请帮忙

任何建议将不胜感激

【问题讨论】：

按原样显示对话框，检查元素，找出“标题”有什么类，然后用你的图标标记做一个.prependTo('title-selector')
@phaberest.. 你知道关闭，在 jquery 中最小化图标.. 就像刷新图标一样
你想刷新什么？
@phaberest 相同的对话框。
你的意思是它的内容？你怎么填？如果它充满了 ajax 请求，您必须发布代码以便我们为您提供适当的帮助。

标签： jquery jquery-ui jquery-ui-dialog

【解决方案1】：

我得到了在标题上添加自定义图标的解决方案

代码如下：

$(function(){


  // ADD HTML FOR NEW BUTTON
    var newBtn = '<a class="ui-dialog-titlebar-refresh ui-corner-all ui-state-default" href="#" role="button" style="position: absolute; top: 50%; right: 5.5em; margin-top: -10px; height: 18px;"><span class="ui-icon ui-icon-refresh">refresh</span></a>';


    ////auto open dialog/////////////       
        //check cookie
        if( document.cookie.indexOf( "Once=true" ) < 0 ) {

        //dialog options
        var dialogOptions = {
            "title" : "title",
             "create": function() {    ///// CREATE FUNCTION TO ADD CUSTOM BUTTON
            $(this).prev('.ui-dialog-titlebar').find('.ui-dialog-title').after(newBtn);
            },
            "open" : function () {
                $("#open").prop("disabled",true);
                $(this).load('pop.php');
                $(this).parent().css('opacity', 0.4);
                $(this).parent().hover( function () { 
                    $(this).css('opacity', 0.9); 
                }, function (event) { 
                    $(this).css('opacity', 0.4); 
                });  
            },
            "width" : 370,
            "height" : 250,
            "dialogClass": 'dlgfixed',
            "position" : ['right bottom'], 
            "modal" : false,
            "autoOpen": true,
            "closeOnEscape" : true,
            "draggable" : true,
            "close" : function(){ 
                $(this).remove(); 
                document.cookie = "Once=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
                $("#open").prop("disabled",false);
            }
        };

        var dialogExtendOptions = {
                       "closable" : true,
                       "maximizable" : true,
                       "minimizable" : true,
     };
        // open dialog
        $("<div><div />").dialog(dialogOptions).dialogExtend(dialogExtendOptions);

  }
});

【讨论】：