利用bootstrap实现简单的弹窗

首先引入bootstrap的js库和jquery库

例如:

<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>

写js方法:

例如:
 

function 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弹窗");
		}

出自:https://www.runoob.com/bootstrap/bootstrap-popover-plugin.html

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值