码迷,mamicode.com
首页 > 其他好文 > 详细

iframe相关知识

时间:2014-09-24 21:34:47      阅读:190      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   http   color   io   os   使用   java   

iframe

      不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小却不像层那样可以“伸缩自如”,所以带来了使用上的麻烦.一般通过百分比设置显示。(简单的java开发应用)

iframe的属性

 

属性描述DTD
align
  • left
  • right
  • top
  • middle
  • bottom

不赞成使用。请使用样式代替。

规定如何根据周围的元素来对齐此框架。

TF
frameborder
  • 1
  • 0
规定是否显示框架周围的边框。 TF
height
  • pixels
  • %
规定 iframe 的高度。 TF
longdesc URL 规定一个页面,该页面包含了有关 iframe 的较长描述。 TF
marginheight pixels 定义 iframe 的顶部和底部的边距。 TF
marginwidth pixels 定义 iframe 的左侧和右侧的边距。 TF
name frame_name 规定 iframe 的名称。 TF
scrolling
  • yes
  • no
  • auto
规定是否在 iframe 中显示滚动条。 TF
src URL 规定在 iframe 中显示的文档的 URL。 TF
width
  • pixels
  • %
定义 iframe 的宽度。 TF

 

IFRAME的简单示例。用于java同一页面上下显示。

 

bubuko.com,布布扣
 1 <script type="text/javascript">
 2 
 3 
 4     //当触发该js方法,则会给iframe的src设置一个新的地址,iframe会自动请求该地址,并响应回新的页面,从而实现了看似同一页面的不同刷新
 5     function seach(){
 6         //获取用户名
 7         var sysUserName=$("#sysUserName").val().trim();
 8         var handle=$("#handle").val().trim();
 9         var startDate=$("#startDate").val().trim();
10         var endDate=$("#endDate").val().trim();
11         
12         if(startDate.length==0&&endDate.length>0){
13             alert("请选择起始时间");
14             return ;
15         }
16         
17         if(endDate.length==0&&startDate.length>0){
18             alert("请选择终止时间");
19             return ;
20         }
21 
22         var url="<%=request.getContextPath()%>/master/sysLog_querySysLog.action?sysUserName="+sysUserName+"&handle="+handle+"&startDate="+startDate+"&endDate="+endDate;
23 
24         $("#myIframe").attr("src",url);
25         
26     }
27 </script>
28 
29 </head>
30 <body>
31     <div class="place">
32     <span>位置:</span>
33     <ul class="placeul">
34     <li><a href="#">日志</a></li>
35     <li><a href="#">日志管理</a></li>
36     </ul>
37     </div>
38     
39     <div class="formbody">
40          <div class="tools">
41             <ul class="toolbar">
42             <li class="click">
43                  用户名:<input type="text" id="sysUserName" name="sysUserName" class="dfinput" style="width: 100px;"/>
44             </li>
45             <li class="click">
46                 操作类型:
47                 <select id="handle" name="handle">
48                     <option value="">--请选择--</option>
49                     <option value="1">添加</option>
50                     <option value="2">删除</option>
51                     <option value="3">修改</option>
52                     <option value="4">登录</option>
53                     <option value="6">导出/打印</option>
54                 </select>  
55            </li>
56            <li class="click">
57                 起始时间:
58                 <input type="text" id="startDate" class="dfinput" onfocus="WdatePicker({maxDate:‘#F{$dp.$D(\‘endDate\‘)||\‘2020-10-01\‘}‘})" style="width: 130px;"/> 
59            </li>
60            <li class="click">
61                 终止时间:
62                 <input type="text" id="endDate" class="dfinput" onfocus="WdatePicker({minDate:‘#F{$dp.$D(\‘startDate\‘)}‘,maxDate:‘2020-10-01‘})" style="width: 130px;"/> 
63            </li>
64            
65             <li onclick="seach();"><span><img src="<%=request.getContextPath() %>/master/images/t04.png"></span>查询</li>
66 
67             </ul>
68             </div>
69      
70    </div>
71     <iframe  src="<%=request.getContextPath() %>/master/sysLog_querySysLog.action" scrolling="yes" id="myIframe" width="100%" height="90%" onload="iFrameHeight(this)"></iframe>
72 </body>
73 </html>
View Code

 

iframe相关知识

标签:des   style   blog   http   color   io   os   使用   java   

原文地址:http://www.cnblogs.com/shangxiaofei/p/3991372.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!