您的位置:首页 > 其它

iframe与form的target简单应用

2013-06-17 17:59 555 查看
大多网站都是有一个整体的固定结构,然后进行局部刷新,我们可以使用AJAX来刷新占位符DIV或者SPAN中的HTML代码的方式去实现。但是HTML片段的编写比整个HTML页面的编写要麻烦。所以许多网站都是使用iframe把整个页面分成几个相对独立的部分,每个部分都是对应一张完整的HTML页面。

      下面给出一个例子,是常用的iframe和form的配合使用的方式,很适合在MVC模式的架构下应用,例子非常简单:

主页面:iframe.html

<html>

<head>

<title>ha</title>

</head>

<body> 

<form name="form1"> 

<div>

<iframe name="query" src="test.html"></iframe> 

<iframe name="list"></iframe> 

</div> 

<div> 

<iframe name="theID"></iframe> 

<iframe name="theName"></iframe> 

</div> 

</form> 

</body>

<form name="jumpform" target="theID" action="test.html">

<input type="submit" value="提交">

</form>

</html>

子页面:test.html

<html>

<head>

<title>HELLO</title>

</head>

<body>

BEN Hello!

</body>

</html>

我们看到主页面分成四个独立的块,iframe标签中通过属性src来指定要显示的HTML子页面,这里可以使用Javascript来动态显示。

我们还看到jumpform里面定义了target的值为iframe-theID,这时候,提交该form的时候,返回来的页面就会在theID的iframe中显示了。

target属性: 

_blank ---------- 新开窗口 

_self ----------- 自身 

_top ------------ 主框架 

_parent --------- 父框架 

自定义名字 ----- 出现于框架结构,将会在该名称的框架内打开链接 

target这个属性指定所链接的页面在浏览器窗口中的打开方式,它的参数值主要有:_blank、_parent、_self、_top,这些参数值代表的含义如下: 

◎_blank,在新浏览器窗口中打开链接文件。 

◎_parent,将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的,则在浏览器全屏窗口中载入链接的文件,就象_self参数一样。 

◎_self,在同一框架或窗口中打开所链接的文档。此参数为默认值,通常不用指定。 

但是我不太理解 

◎_top,在当前的整个浏览器窗口中打开所链接的文档,因而会删除所有框架
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: