[英]Why won't my bootstrap modal pop up?
我希望在頁面加載后立即彈出新聞通訊模版,但在加載屏幕時加載模版時遇到了一些麻煩。 有人能幫我嗎?
<!-- Introduction Modal -->
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Subscribe our Newsletter</h4>
</div>
<div class="modal-body">
<p>Subscribe to our mailing list to get the latest updates straight in your inbox.</p>
<form>
<div class="form-group">
<input type="text" class="form-control" placeholder="Name">
</div>
<div class="form-group">
<input type="email" class="form-control" placeholder="Email Address">
</div>
<button type="submit" class="btn btn-primary">Subscribe</button>
</form>
</div>
</div>
</div>
</div>
<!-- Modal Popup -->
<script type="text/javascript">
$(document).ready(function(){
$("#myModal").modal('show');
});
</script>
您的代碼工作正常,您可以嘗試檢查您的jquery鏈接和bootstrap鏈接
$(function() { $("#myModal").modal(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> <link href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"/> <div id="myModal" class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Subscribe our Newsletter</h4> </div> <div class="modal-body"> <p>Subscribe to our mailing list to get the latest updates straight in your inbox.</p> <form> <div class="form-group"> <input type="text" class="form-control" placeholder="Name"> </div> <div class="form-group"> <input type="email" class="form-control" placeholder="Email Address"> </div> <button type="submit" class="btn btn-primary">Subscribe</button> </form> </div> </div> </div> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.