jquery - jQuery插件触发事件/函数取决于单击的按钮

Question

我正在尝试创建一个简单的 jQuery 插件供自己使用（是的，我知道已经有一个带有 jQ​​uery 的官方插件来做这种事情，但我更喜欢我自己的）。我已经把它基本上编码好了，唯一我不知道该怎么做的问题是检测点击了哪个按钮，并基于该调用通过插件提供的相应功能。最好的方法是什么？

所以这是我到目前为止的代码：

(function($){
$.fn.extend({

    confirmDialog: function(options) {

        var defaults = {
           titleText: "Confirmation",
           bodyText: "Are you sure you want to delete this?",
           confirmButtonText: "Delete",
           confirmAction: function(){},
           cancelAction: function(){},
        };

        var options = $.extend(defaults, options);

        return this.each(function() {

    $('<div class="confirmation-box-wrapper"><div class="confirmation-box"><div class="confirmation-title">'+options.titleText+'</div><div class="confirmation-message">'+options.bodyText+'</div><div class="options"><a class="buttons cancel">Cancel</a><a class="buttons confirmation">'+options.confirmButtonText+'</a></div></div></div>').appendTo('body');  



        });
    }
});
})(jQuery);

所以我期望的用法是这样的：

 $(".elementToDelete").confirmDialog({
      confirmAction: function(){ alert("Deleted"); },
      cancelAction: function(){ alert("Cancelled"); }

  })

Answer 1

您需要绑定该扩展中的按钮。http://jsfiddle.net/4mjBb/

var wrapper=$('<div class="confirmation-box-wrapper"... ...')appendTo('body'); 

wrapper.find('.confirmation').on('click', function(){
    if (typeof options.confirmAction=='function') options.confirmAction();

});
wrapper.find('.cancel').on('click', function(){
    if (typeof options.cancelAction=='function') options.cancelAction();
});