我想使用Bootstrap库中的Modal。
单击按钮时,会显示模态,但透明。
我无法弄清楚为什么会这样。
JSFiddle链接: http://jsfiddle.net/0cqkdjey/
这是我的HTML:
<div id="loginWindow" tabindex="-1" role="dialog" class="modal fade" aria-hidden="true">
<div class="modal-dialog">
<div class="model-content">
<div class="modal-header">
<button type="button" data-dismiss="modal" class="close">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
<h4 id="loginLabel" class="modal-title">Log in</h4>
</div>
<div class="modal-body">
<input id="email" type="text">
</div>
<div class="modal-footer">
<p>blablabla</p>
</div>
</div>
</div>
</div>
这是我的JavaScript:
$(document).ready( function() {
// set focus when modal is opened
$('#loginWindow').on('shown.bs.modal', function () {
$('#email').focus();
});
// everytime the button is pushed, open the modal, and trigger the shown.bs.modal event
$('#loginButton').click(function () {
$('#loginWindow').modal({
show: true
});
});
});
答案 0 :(得分:11)
找到它:
<div class="model-content">
应该是:
<div class="modal-content"> // Notice the a
那应该解决它。
干杯!