0

我正在开发 MooTools 确认框功能。其中我有两个按钮,分别是 OK 和 CANCEL。

所以我想在单击 OK 时返回 TRUE,并在单击 CANCEL 时返回 FALSE。

这是我的功能代码。

function confirm_box(title, text)
{
    var className = 'msgAlert info';
    var defaut_title ='Information';

    // Placing the Overlay
    var overlay = new Element('div', {'class':'msgAlert_overlay'});
    $$('body').adopt(overlay);

    // Placing the Main Div With class name
    var main_box  = new Element('div', {'class': className});
    $$('body').adopt(main_box);

    var content_div = new Element('div', {'class':'msgAlert_popup'});
    //<a href="javascript:;" class="msgAlert_close"></a>
    if(title == '')
        title=defaut_title;
    content_div.set('html','<div class="msgAlert_header"><h4>'+title+'</h4></div><div class="msgAlert_content">'+text+'</div>');
    main_box.adopt(content_div);

    content_div.getChildren('a.msgAlert_close');

    var footer_div = new Element('div',{'class':'msgAlert_footer'});
    var ok_btn = new Element('button');
    ok_btn.addEvent('click', function(){
        main_box.fade(0);
        //overlay.fade(0);
        (function(){main_box.dispose(); overlay.dispose(); }).delay(350);
        return true;
    });

    var cancel_btn = new Element('button');
    cancel_btn.addEvent('click', function(){
        main_box.fade(0);
        //overlay.fade(0);
        (function(){main_box.dispose(); overlay.dispose();}).delay(350);
        return false;
    });

    ok_btn.set('html','Ok');
    cancel_btn.set('html','Cancel');
    footer_div.adopt(ok_btn);
    footer_div.adopt(cancel_btn);
    main_box.adopt(footer_div);
    ok_btn.focus();
}

我在点击相应的按钮时放置了返回 TRUE 和 FALSE。

任何人都可以建议我必须采用哪种方式,以便我可以像 JS 确认框一样访问我的功能:

就像 :

if(confirm_box(title, text))
{
 alert('Yes');
}
else
{
 alert('No');
}
4

1 回答 1

1

这是行不通的。基本上,您可以使用本机

if (confirm("are you sure")) { ... } else { ... }

这很好,因为它阻塞了 UI 线程......

当您想要复制确认框时,您需要使用事件回调方法,因为您的函数不会有返回值。

在伪代码中,这将是:

var confirm_box = function(title, text, onConfim, onCancel) {

    ... 
    confirmEl.addEvent("click", onConfirm);

    cancelEl.addEvent("click", onCancel);
};


confirm_box("Are you sure?", "Please confirm by clicking below", function() {
    alert("yes");
}, function() {
    alert("no");
});

在 mootools 和 Classes 的上下文中,您可能想要做一个与事件一起工作的确认类。如果你想要一个例子,请给我一个喊叫。

于 2011-10-11T13:10:51.730 回答