我正在用bootstrap做一个网站。
基本上,我想在主页中使用一个模态,通过Hero Unit中的按钮来调用。
按钮代码:
<button type="button"
class="btn btn-warning btn-large"
data-toggle="modal"
data-target="#myModal">Open Modal</button>
模态代码:
<div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">In Costruzione</h3>
</div>
<div class="modal-body">
<p>Test Modal: Bootstrap</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Chiudi</button>
<button class="btn btn-warning">Salva</button>
</div>
</div>
问题是,只要我点击按钮,模态就会淡入,然后立即消失。
我很感激你的帮助。
此外,如何改变下拉三角形的颜色(指向向上,没有悬停)?我正在做一个基于橙色和棕色的网站,那个蓝色的东西真的很烦人。
如果使用jquery两次附加事件监听器,也会出现这个问题。
例如,你可以在不解除绑定的情况下设置:
$("body").on("click","#fixerror",function(event){
$("#fixerrormodal").modal('toggle')
})
如果发生这种情况,事件将连续触发两次,模态将消失。
$("body").on("click","#fixerror",function(event){
$("#fixerrormodal").modal()
$("#fixerrormodal").modal('toggle')
})
参见示例:http://embed.plnkr.co/i5xB1WbX7zgXrbDMhNAW/preview
我有同样的问题,因为我切换了我的模式两次,如下所示:
statusCode: {
410: function (request, status, error) { //custom error code
document.getElementById('modalbody').innerHTML = error;
$('#myErrorModal').modal('toggle')
}
},
error: function (request, error) {
document.getElementById('modalbody').innerHTML = error;
$('#myErrorModal').modal('toggle')
}
我删除了一个出现项:
(“# myErrorModal美元)。“充气”(资本)
它像魔法一样起作用!
如果使用jquery两次附加事件监听器,也会出现这个问题。
例如,你可以在不解除绑定的情况下设置:
$("body").on("click","#fixerror",function(event){
$("#fixerrormodal").modal('toggle')
})
如果发生这种情况,事件将连续触发两次,模态将消失。
$("body").on("click","#fixerror",function(event){
$("#fixerrormodal").modal()
$("#fixerrormodal").modal('toggle')
})
参见示例:http://embed.plnkr.co/i5xB1WbX7zgXrbDMhNAW/preview