模态框代替alert、confirm

<link rel="stylesheet" href="../css/global-theme/bootstrap/3.0.1/css/bootstrap.css">
<script src="../css/global-theme/bootstrap/3.0.1/js/bootstrap.min.js"></script>
<!-- 模态框(Modal) -->
<div class="modal fade" id="alert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">提示</h4>
			</div>
			<div class="modal-body"></div>
			<div class="modal-footer">
				<!-- <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> -->
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal -->
</div>
	<script type="text/javascript">
function closeAlert(){
	$('#alert').modal("hide");
}
function myAlert(Msg){
	$('#alert .modal-body').html(Msg);
	$('#alert .modal-footer').empty().append("<button type='button' class='btn btn-default' data-dismiss='modal'>关闭</button>");
	$('#alert').modal({keyboard: true});
}
function myConfirm(title,Msg ,nofunc,yesfunc,noText,yesText){
	$("#alert #myModalLabel").html(title ? title : "提示");
	$('#alert .modal-body').empty().html(Msg);
	$("#alert .modal-footer").empty().append("<button type='button' class='btn btn-default' data-dismiss='modal' onclick='"+nofunc+";'>"+(!noText ? '否':noText)+"</button><button type='button' class='btn btn-danger' data-dismiss='modal' onclick='"+yesfunc+";'>"+(!yesText ? '是':yesText)+"</button>");
	$('#alert').modal({keyboard: true});
}
</script>

猜你喜欢

转载自blog.csdn.net/weixin_41796956/article/details/84834570