Question

正在使用fancybox构建确认对话框。这是处理对话框创建的模块

var Utility = (function() {
function confirm_dialog(title,msg,callback)
        {
            var ret;
            $.fancybox('<div class="confirm-dialog"></div>',
            {
                'width':400,
                'height':250,
                'modal' : true,
                'transitionIn' : 'none',
                'transitionOut': 'none',
                'speedIn' : 300,
                'speedOut' : 300,
                'autoScale' : false,
                'scrolling' : 'no',
                'overlayShow' : true,
                'overlayOpacity' : 0.3,
                'overlayColor' : '#666',
                'padding':10,
                'onComplete':function() {
                    $('.okBtn').click(function(){
                            ret = true;
                            $.fancybox.close();
                        })
                    $('.cancelBtn').click(function() {
                        ret = false;
                        $.fancybox.close();
                    })
                },
                'onClosed':function() {
                    callback.call(this,ret);
                }
            });
            var html = '<div class="confirm-box">'+
                       '<div class="confirm-title">'+title+'</div>'+
                       '<div class="confirm-msg">'+msg+'</div>'+
                       '<div class="confirm-buttons">'+
                       '<button class="okBtn">Ok</button>'+
                       '<button class="cancelBtn">Cancel</button>'+
                       '</div>'+
                       '</div>';
            $('.confirm-dialog').append(html);
        }
        return {  dialog : confirm_dialog }
})();

这是我实施确认对话框的方式

Utility.dialog('Delete Pheed','Are sure you want to delete this pheed ?',
                        alert('hi'));

花哨的盒子出现但对话框没有显示，我做错了什么

Answer 1

精美的方框api有content选项，可以包含html内容。 confirm-dialog div的内容。

编辑：请确保你有content的fancybox版本1.3+才能正常工作。

我对此不确定，如果我错了请纠正我，这种方法的问题是confirm-dialog函数之后的dom元素中找不到fancybox div叫做。

花式框确认对话框

1 个答案: