本文介绍如何使用HTML和JavaScript实现弹窗功能，并通过iframe加载动态内容，演示了页面加载与用户交互的技巧。
<html>
<head>
<link rel="stylesheet" href="js/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="js/bootstrap-responsive.css" type="text/css" />
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<body>
<a class="btn" id="open">弹窗</a>
<div id="myModal" class="modal hide fade">
<div class="modal-body">
<iframe id="myIframe" width="100%" height="100%"></iframe>
</div>
</div>
</script>
</body>
<script>
$("#open").click(function(){
$("#myIframe").attr("src","test.html");
$('#myModal').modal({show:true});
});
</script>
</html>
<head>
<link rel="stylesheet" href="js/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="js/bootstrap-responsive.css" type="text/css" />
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<body>
<a class="btn" id="open">弹窗</a>
<div id="myModal" class="modal hide fade">
<div class="modal-body">
<iframe id="myIframe" width="100%" height="100%"></iframe>
</div>
</div>
</script>
</body>
<script>
$("#open").click(function(){
$("#myIframe").attr("src","test.html");
$('#myModal').modal({show:true});
});
</script>
</html>
扫一扫
832
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
