如何在没有widget工厂的情况下创建jQuery对话框?

时间:2012-07-22 17:32:55

标签: javascript jquery-ui client-side

我正在使用jQuery机制创建widget factory对话框。

function ($) {

    function myDialogDiv() {...} // create all required HTML for the dialog

    $.widget("myApp.myDialog", {

        _create:function() {
            var div = myDialogDiv();
            var props = {autoOpen:false, height:'200', width:'30%'};
            var onClose = function () {};
            $(div).dialog(props, onClose);
        },

        _init:function() {$('#myDialog').dialog('open');}
    })

}(jQuery))

...

// open the dialog on button click
$('.myDialogButton').bind("click", function(){$(this).myDialog();});

它运作正常。现在我想知道是否可以创建一个jQuery对话框而不用 widget factory

1 个答案:

答案 0 :(得分:1)

当然,您可以编写自己的对话库或使用另一个具有自己的初始化方案的对话库; - )

虽然失败了,不。 jQuery Dialogs(就像所有jQuery UI小部件一样)需要一组初始化参数,并且您可以在每次需要小部件时重现它们,或者您可以使用“小部件工厂”样式隐藏构建器内的所有初始化内容功能

此外,你必须记住,jQuery UI,就像jQuery一样,不会试图为你做任何事情:他们故意将大量的东西留给开发人员,例如。将按钮连接到对话框的生成。当你想到它时这是有道理的,因为其他人可能会使用A标签,其他人可能使用DIV等。图书馆的目标只是为了避免重做常见的东西,而不是让你免于写任何东西。代码就在你的最后。

我能看到的唯一另一种选择是一种半途而废的方法,每次都重新制作对话框,但使用一组全局选项来节省重复:

var GLOBAL_DIALOG_PROPS = {autoOpen:false, height:'200', width:'30%'}
function dialogButtonClickHandler() {
    $(this).myDialog().dialog(GLOBAL_DIALOG_PROPS, onClose).dialog('open');
}
$('.myDialogButton').bind("click", dialogButtonClickHandler); 

但是在一天结束时,必须完成初始化工作,并且如果你要在代码中的多个位置执行它,聪明的事情就是干掉它并将公共位存储在某处(比如在你的位置)小工厂)。