利用bootstrap的模态框实现弹出确认提示框
前端 ⋅
波波 ⋅
1年前 ⋅
2 点赞 ⋅
2,664 阅读 ⋅
0 评论
具体如下:
/** * 自定义的弹出确认框 * @param callback 回调函数 * @param heading 标题 * @param content 内容 * @param okButtonTxt 确认的btn文案 默认文案 确认 * @param cancelButtonTxt 取消的btn文案 默认文案 取消 */ confirm:function(callback, heading, content, okButtonTxt, cancelButtonTxt) { heading = heading || '温馨提示'; content = content || '您确定要操作吗?'; callback = callback || common.alertMsg; okButtonTxt = okButtonTxt || '确认'; cancelButtonTxt = cancelButtonTxt || '取消'; var confirmModal = $('<div class="modal fade">'+ '<div class="modal-dialog">'+ '<div class="modal-content">'+ '<div class="modal-header">'+ '<h4 class="modal-title">'+ heading +'</h4>'+ '<button type="button" class="close" data-dismiss="modal">×</button>'+ '</div>'+ '<div class="modal-body">' + content + '</div>'+ '<div class="modal-footer">'+ '<button id="okButton" type="button" class="btn btn-success">' +okButtonTxt+ '</button>'+ '<button type="button" class="btn btn-secondary" data-dismiss="modal">' +cancelButtonTxt+ '</button>'+ '</div>'+ '</div>'+ '</div>'+ '</div>'); //点击确认的操作 confirmModal.find('#okButton').click(function(event) { //todo eval将字符串转化为函数执行 eval(callback); confirmModal.modal('hide'); }); //显示model框 confirmModal.modal('show'); }