javascript - 事件返回 True/False 的 jQuery 插件

标签 javascript jquery events jquery-plugins boolean

我正在创建一个插件来替换项目的警报/确认,我很好奇是否有办法让它像真正的确认一样,你可以在哪里做:

if(confirm('Yes or no?')){alert('You agreed!');}

现在我可以使用以下语法进行回调:

$.alert('yes or no',{type:'confirm'});

但我希望能够做到:

if($.alert('yes or no',{type:'confirm'})){/*some action on true*/}

这是目前为止我在点击事件中查找所有 CAPS 注释的内容(请记住,这仍在开发中,因此 HTML 和内容仍然有点恶心):

(function($) {
    $.alert = function(message,options) {
        defaults = {
            type:'alert',
            callback:function(){}
        }
        options = $.extend({},defaults,options);
        if(options.type == 'confirm'){
            $('<div style="display:none" class="alerthiddenoverlay"></div><div style="display:none" class="customalertbox"><div><img src="http://cdn.iconfinder.net/data/icons/basicset/tick_48.png"><p>'+message+'</p><br class="clear"><span><a class="cancel" href="#cancel">Cancel</a><a class="ok" href="#ok">OK</a></span><br class="clear"></div></div>').prependTo('body');
        }
        else{
            $('<div style="display:none" class="alerthiddenoverlay"></div><div style="display:none" class="customalertbox"><div><img src="http://cdn.iconfinder.net/data/icons/basicset/warning_48.png"><p>'+message+'</p><br class="clear"><span><a class="ok" href="#ok">OK</a></span><br class="clear"></div></div>').prependTo('body');
        }
        $alertboxclass=$('.customalertbox');
        $alerthiddenoverlay=$('.alerthiddenoverlay');
        $alertboxclass.find('a').click(function(event){
            event.preventDefault();
            var the_return = false;
            if($(this).attr('href') == '#ok'){
                var the_return = true;
            }
            $alertboxclass.fadeOut(250,function(){$alerthiddenoverlay.delay(250).fadeOut(250,function(){$(this).remove();options.callback.call(this,the_return);});$(this).remove()});
        });
        $alertboxclass.css({
            top:$(window).height()/2-$alertboxclass.height()/2,
            left:$(window).width()/2-$alertboxclass.width()/2
        });
        $alerthiddenoverlay.css({height:$(window).height()+'px',width:'100%',position:'fixed',zIndex:'9998'}).fadeIn(250,function(){$alertboxclass.delay(250).fadeIn()});
    }
})(jQuery);

最佳答案

我认为将回调方法作为参数传递给 $.alert 函数将是最简单的选择。如果那是一个交易破坏者,我可能会看看用于链接事件的 .queue() 方法。

http://api.jquery.com/queue/

关于javascript - 事件返回 True/False 的 jQuery 插件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3419593/

相关文章:

jquery - 单击事件不适用于动态生成的元素

c++ - dynamic_cast<T>(event) 是什么意思?

jquery - TypeScript 不允许在 .data() 和数字/字符串之间进行比较

jquery - 如何使用 jQuery 更改响应式样式

来自 jQuery $.post 的 PHP session

javascript - 将 HTML 动态添加到 iFrame 中 - Javascript

javascript - 有什么方法可以在 jQuery 中委托(delegate)事件吗?

javascript - Pig Latin 在检查 JavaScript 中的元音时有缺陷的 If 语句

javascript - 最小化窗口时标签的文本与文本区域重叠

javascript - 单击选项卡无法准确工作