一直头疼不能找一个非常简单且实用的确认删除插件。但是,还是让我找到了。
效果图
上代码
/*
* jQuery Plugin : jConfirmAction
*
* by Hidayat Sagita
* http://www.webstuffshare.com
* Licensed Under GPL version 2 license.
*
*/
(function($){
jQuery.fn.jConfirmAction = function (options) {
// Some jConfirmAction options (limited to customize language) :
// question : a text for your question.
// yesAnswer : a text for Yes answer.
// cancelAnswer : a text for Cancel/No answer.
var theOptions = jQuery.extend ({
question: "Are You Sure ?",//提示框问题
yesAnswer: "Yes",//确认按钮字符串
cancelAnswer: "Cancel"//取消字符串
}, options);
return this.each (function () {
$(this).bind('click', function(e) {
e.preventDefault();
thisHref = $(this).attr('href');//获取原本a标签的href链接地址。
if($(this).next('.question').length <= 0)
$(this).after('<div class="question">'+theOptions.question+'<br/> <span class="yes">'+theOptions.yesAnswer+'</span><span class="cancel">'+theOptions.cancelAnswer+'</span></div>');
$(this).next('.question').animate({opacity: 1}, 300);
$('.yes').bind('click', function(){//绑定点击“是”的事件
window.location = thisHref;//继续执行原本a标签的跳转链接
});
$('.cancel').bind('click', function(){//绑定点击“否”事件
$(this).parents('.question').fadeOut(300, function() {//整个弹出窗体淡出
$(this).remove();//该试题消失
});
});
});
});
}
})(jQuery);
代码写的简单易懂,我很喜欢这种风格。