BootStrap Modal Create
bootstrapを使ったことがありますが、中にポップアップ層があると知っています.
小弟はここでただ上に包装しただけです.交流のためだけに.
まずこのmodalはbootstrap.css/jsに頼っています.
modal.js
demo 调用
著作権を尊重して、利用したい友達は出所を明記してください.
小弟はここでただ上に包装しただけです.交流のためだけに.
まずこのmodalはbootstrap.css/jsに頼っています.
modal.js
/** * Modal.js * @ref bootstrap.js bootstrap.css * @author vincent */ var H = (function() { function addPrefix(str, prefix) { return str ? str.split(/\s+/).map(function(t) { return prefix + t; }).join(' ') : ''; } function btn(text, btnStyle, url, skipPrefix) { btnStyle = skipPrefix ? btnStyle : addPrefix(btnStyle, 'btn-'); if (btnStyle) btnStyle = ' ' + btnStyle; var href = url ? ' href="' + url + '"' : ''; return ''+text+''; } function icon(style, skipPrefix) { return style ? (' ') : ''; } return { 'btn': btn, 'icon': icon }; })(); function Modal(opt){ this.opt = opt; this.context = '
'+ '
'+ ' x'+ ''+ ''+ '
'+ '
' ; } Modal.prototype = { constructor : Modal, show : function(){ var ui = $(this.context); var opt = this.opt; opt.initView(ui); $(document.body).append(ui); ui.on('hidden', function() { ui.remove(); }); if ($.isFunction(opt.hidden)) { ui.on('hidden', opt.hidden); } delete opt.initView; delete opt.hidden; return ui.modal(opt); }, };
demo 调用
function showSubmitError(reason, fn) {
new Modal({
'backdrop': 'static',
'initView': function(ui) {
ui.find('.modal-header').append("Action");
ui.find('.modal-body').html('form ' + reason + '
');
// var ok = $('OK');
var ok = $(H.btn(H.icon('ok white') + 'OK', 'primary'));
ui.find('.modal-footer').append(ok.click(function() { ui.modal('hide'); }));
},
'hidden': fn
}).show();
Okさん、興味がある友達は一緒に交流してください.著作権を尊重して、利用したい友達は出所を明記してください.