好久没写文章了,感觉文笔太生疏了,希望大家不要见笑。
我们在做弹出式窗体时,可以用jQuery.impromptu插件来简化许多工作。我们只需做点小小的添加就能实现强大的功能。
jquery.impromptu 下载地址:http://trentrichardson.com/Impromptu/index.PHP
效果图:
方法1:
????? 新建一个ifame容器页面:FrameContainer.aspx
该页面代码:?
?1?<%@?Page?Language="C#"?AutoEventWireup="true"?%>
?2?<script?runat="server">
?3?????
?4?????protected?string?frameName;
?5?
?6?????protected?void?Page_Load(object?sender,?EventArgs?e)
?7?????{
?8?????????frameName?=?Request["frameName"]????"";
?9?????}
10?</script>
11?<iframe?id="iframe"?src='<%=?frameName?%>'?width="100%"?scrolling="no"?frameborder="0"?onload="this.height=iframe.document.body.scrollHeight;"></iframe>
?在jquery.impromptu文件添加代码:
? ?
?1?function?getFrame(frameName)
?2?????{
?3?????????$.get(
?4?????????????????"FrameContainer.aspx?frameName="?+?frameName?,
?5?????????????????function(date)?{
?6?????????????????????$.prompt(date,?{
?7?????????????????????????buttons:?{}
?8?????????????????????});
?9?????????????????}
10?????????);
11?????}
? ?
? ?
?调用时代码
? ?
<input??type="button"?value="正常"?onclick="getFrame('default.aspx');"/>??
? ?
? ?
单击button时就在iframe载入'default.aspx'
别忘了引用jquery 和 jquery.impromptu
方法2:
????? 该方法不需容器页面来承载iframe,直接在jquery.impromptu添加代码:
? ?
1?function?getFrame(frameName)?{
2?????$.prompt("<iframe?id='iframe'?src='"?+?frameName?+?"'?width='100%'?scrolling='no'?frameborder='0'?onload='this.height=iframe.document.body.scrollHeight'></iframe>",?{
3?????????buttons:?{}
4?????});??//onload='this.height=iframe.document.body.scrollHeight'保证iframe的高度和加载的页面一直
5?
6?};
? ?
还是一样的调用方法
? ?
<input??type="button"?value="正常"?onclick="getFrame('default.aspx');"/>
?别忘了引用jquery 和 jquery.impromptu
最后我们可能需要在弹出式iframe中,做完操作就关闭弹框 这时我们需要这么写:
? ?
window.parent.document.body.removeChild(window.parent.document.getElementById("jqibox"));
? ?
jqibox 是jquery.impromptu弹出容器
如对本文有疑问,请提交到交流论坛,广大热心网友会为你解答!! 点击进入论坛