标签:style blog http java 使用 os io 数据
在页面中用到弹出新页面的情况比较多的,一般来说都是使用JS方法<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <ul> <li>操作一</li> <li>操作二</li> <li><asp:Button ID="btnShow" runat="server" Text="操作三(弹出层)" OnClientClick="return ShowBlock();" /></li> <li>操作四</li> <li>操作五</li> </ul> </div> <!--弹出层,--> <div id="divNewBlock" style=" border:solid 5px;padding:10px;width:600px;z-index:1001; position: absolute; display:none;top:50%; left:10%;margin:-50px;"> <div style="padding:3px 15px 3px 15px;text-align:left;vertical-align:middle;" > <div> 弹出层,平时在隐藏状态,这里可以放控件,加载数据,操作数据等。 </div> <div> <asp:Button ID="BtnOperation" runat="server" Text="操作按钮" OnClientClick="return Operate();"/> <asp:Button ID="BttCancel" runat="server" Text="关闭" OnClientClick="return HideBlock();" /> </div> </div> </div> </form> </body> <script type="text/javascript" language="javascript"> function HideBlock() { document.getElementById("divNewBlock").style.display = "none"; return false; } function ShowBlock() { var set = SetBlock(); document.getElementById("divNewBlock").style.display = ""; return false; } function SetBlock() { var top = document.body.scrollTop; var left = document.body.scrollLeft; var height = document.body.clientHeight; var width = document.body.clientWidth; if (top == 0 && left == 0 && height == 0 && width == 0) { top = document.documentElement.scrollTop; left = document.documentElement.scrollLeft; height = document.documentElement.clientHeight; width = document.documentElement.clientWidth; } return { top: top, left: left, height: height, width: width }; } function Operate() { return false; } </script> </html>
效果如下:
其实是很简单的控制,这样一来加载数据和操作等都在当前页面,对于要求不是很多的操作就方便了许多。
代码下载:http://download.csdn.net/detail/yysyangyangyangshan/7734257ASP.NET—013:实现带控件的弹出层(弹出框),布布扣,bubuko.com
标签:style blog http java 使用 os io 数据
原文地址:http://blog.csdn.net/yysyangyangyangshan/article/details/38458169