利用bootstrap實現簡單的彈窗
阿新 • • 發佈：2018-12-31
首先引入bootstrap的js庫和jquery庫
例如：
例如：
<script src="${ctx}/js/jquery.min.js"></script><script src="js/bootstrap.min.js"></script>寫js方法：
例如：出自：https://www.runoob.com/bootstrap/bootstrap-popover-plugin.htmlfunction chstatConfirm(flag, params) { if ($("#myConfirm").length > 0) { $("#myConfirm").remove(); } var html = "<div class='modal fade' id='myConfirm' >" + "<div class='modal-backdrop in' style='opacity:0; '></div>" + "<div class='modal-dialog' style='z-index:2901; margin-top:60px; width:400px; '>" + "<div class='modal-content'>" + "<div class='modal-header' style='font-size:16px; '>" + "<span class='glyphicon glyphicon-envelope'> </span>選定知識點<button type='button' class='close' data-dismiss='modal'>" + "<span style='font-size:20px; ' class='glyphicon glyphicon-remove'></span><tton></div>" + "<div class='modal-body text-center' id='myConfirmContent' style='font-size:18px; '>" + "是否選擇已選知識點？" + "</div>" + "<div class='modal-footer ' style=''>" + "<button class='btn btn-danger ' id='confirmOk' >確定<tton>" + "<button class='btn btn-info ' data-dismiss='modal'>取消<tton>" + "</div>" + "</div></div></div>"; $("body").append(html); $("#myConfirm").modal("show"); $("#confirmOk").on("click", function() { $("#myConfirm").modal("hide"); add(flag, params); // 執行函式 }); } function add(a,b){ alert("bootstrap彈窗"); }