我正在尝试在bootstrap上构建一个可配置的模态窗口。我的意图是通过创建函数参数动态填充模态。
一个参数是标题的标题(titolo
),第二个(messaggio
)是模式正文的文本,可以是html或纯文本,第三个(conferma
如果单击确认按钮(如果存在此函数则创建),则调用该函数;如果模态窗口关闭,则调用第四个函数(callback
)。
不幸的是我无法让它发挥作用,你能帮助我吗?
function apriModal(titolo,messaggio,conferma,callback){
jQuery.noConflict();
var re=new RegExp("</?\w+\s+[^>]*>");
$("#modalHeaderTitle").text(titolo);
if(messaggio.match(re)){
$("#modalBodyText").html(messaggio);
}
else{
$("#modalBodyText").html("<p>"+messaggio+"</p>");
}
(typeof conferma == 'function') ? $("#modalConfirm").show() : $("#modalConfirm").hide();
$("#finestraModal").modal('show');
$("#modalConfirm").click(function(){
if(conferma){
$("#finestraModal").modal('hide');
conferma.apply();
}
});
$("#modalClose").click(function(){
if(callback){
callback.apply();
}
$("#finestraModal").modal('hide');
});
}
这是模态的基本html:
<div id="finestraModal" class="modal hide fade">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="modalHeaderTitle"></h3>
</div>
<div class="modal-body" id="modalBodyText">
</div>
<div class="modal-footer">
<a href="#" id="modalClose" class="btn">Chiudi</a>
<a href="#" id="modalConfirm" class="btn btn-primary">Conferma</a>
</div>
</div>
答案 0 :(得分:0)
您已使用jQuery.noConflict()
,但在以下脚本中继续使用$
。
function apriModal(titolo,messaggio,conferma,callback){
jQuery.noConflict();
应该改为
function apriModal(titolo,messaggio,conferma,callback){
var $ = jQuery.noConflict(); // or other variable name
如果您想使用其他库,可以将jQuery.noConflict()
分配给我的演示中显示的其他变量,或在需要时使用jQuery
。