我有两个模式,它们在单击按钮时弹出。一个工作正常,但是对于第二个,屏幕变黑并且没有任何反应:
首先,工作模式:
<div id="deleteConfirmation" class="hidden, modal fade">
<div class="modal-dialog">
<div class="modal-content">
<h5>Are you sure you want to delete this contact?</h5>
<button id="deleteOk">
Yes
</button>
<button id="deleteNo">
No
</button>
</div>
</div>
</div>
并弹出这个命令:
$('#deleteConfirmation').modal('show');
第二个,几乎相同,但不工作:
<div id="addContact" class="hidden, modal fade">
<div class="modal-header">
<h5>Add New Contact</h5>
</div>
<div class="modal-dialog">
<div class="modal-content">
<label>First Name </label><input /> <br />
<label>Last Name </label><input /> <br />
<label>Address </label><input /> <br />
<label>Phone Number </label><input /> <br />
<button id="addConfirm">
Confirm
</button>
</div>
</div>
</div>
还有命令:
$('#addContact').modal('show');
它基本上是两个相同的模态,但是对于第二个,屏幕变黑,而第一个模态正常工作。我假设这是我正在使用的类(class)之一。这里似乎有什么问题?
最佳答案
这里有错字:
<div id="deleteConfirmation" class="hidden, modal fade">
<div id="addContact" class="hidden, modal fade">
去掉逗号:
<div id="deleteConfirmation" class="hidden modal fade">
<div id="addContact" class="hidden modal fade">
因此脚本无法确定hidden
类是否被正确应用,最终你只会看到黑 死机屏幕! :O
关于javascript - Bootstrap 模式 - 屏幕变黑,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30910569/