/**
* boostrap-confirm.js v1.0 author: fengzy
*/
;(function($,window,document,undefined){
// var jconfirm, Jconfirm;
//对外提供的方法
$.alert = function (options) {
return jconfirm(options);
};
$.confirm = function (options) {
options.cancelButton = true;
options.confirmButton = true;
return jconfirm(options);
};
//参数配置
var jconfirm = function (options) {
var options = $.extend({}, jconfirm.defaults, options);
return new Jobj(options);
};
//构造对象
var Jobj = function (options) {
$.extend(this, options);
this.init();
};
//构造对象方法
Jobj.prototype = {
init: function () {
var that = this;
this.buildHTML();
this.bindEvents();
},
buildHTML: function () {
var that = this;
$(this.template).appendTo(this.container)
},
bindEvents: function () {
var that = this;
//显示btn
if(that.cancelButton){
$("#confirmModal .jconfrim-cancel").show();
}else{
$("#confirmModal .jconfrim-cancel").hide();
}
//自动关闭
if(this.autoClose){
this._startCountDown(this.autoClose);
}
//回调
if (that.confirmButton) {
$("#confirmModal .jconfrim-submit").unbind( "click" );
$('#confirmModal .jconfrim-submit').click(function (e) {
e.preventDefault();
var r = that.confirm();
if (typeof r === 'undefined' || r){
that.close();
}
});
}else{
$("#confirmModal .jconfrim-submit").unbind( "click" );
}
$("#confirmModal .modal-body").html(this.content);
$('#confirmModal').modal('show');
},
_startCountDown: function (second) {
var that = this;
var time = second*1000;
this.interval = setInterval(function () {
$('#confirmModal .jconfrim-submit').trigger('click');
clearInterval(that.interval);
}, time);
},
close: function () {
$('#confirmModal').modal('hide');
}
};
//设置默认参数
jconfirm.defaults = {
template:
'<div class="modal fade" id="confirmModal" tabindex="1000" data-backdrop="false">'+
'<div class="modal-dialog" style="width:25%">'+
'<div class="modal-content">'+
'<div class="modal-body"></div>'+
'<div class="modal-footer">'+
'<button type="button" class="btn btn-primary jconfrim-submit" data-dismiss="modal">确定</button>'+
'<button type="button" class="btn jconfrim-cancel" data-dismiss="modal">取消</button>'+
'</div>'+
'</div>'+
'</div>'+
'</div>',
title: 'Hello',
content: 'Are you sure to continue?',
icon: '',
container: 'body',
autoClose:'',
confirmButton:false,
cancelButton:false,
confirm: function () {
},
cancel: function () {
},
contentLoaded: function () {
}
}
})(jQuery,window,document);
调用示例:
$("#button1").click(function(){
$.alert({
content: '请输入用户名'
});
});
$("#button2").click(function(){
$.confirm({
content: '确认要删除吗?',
confirm: function () {
alert('删除');
}
});
});
jquery bootstrap 弹出提示层插件
猜你喜欢
转载自blog.csdn.net/fzy629442466/article/details/84786336
今日推荐
周排行