JavaScript中iframe实现局部刷新的几种方法汇总
Iframe是一种嵌入网页的框架形式，Web页面可以通过更改嵌入的部分，达到部分内容刷新。
Iframe的用法与普通的标签元素DIV类似，可以指定在页面中嵌入的位置、颜色、界面布局等
一、iframe实现局部刷新方法一
<scripttype="text/javascript">
$(function(){
$("#a1").click(function(){
varname=$(this).attr("name");
$("#iframe").attr("src",name).ready();
})
$("#a2").click(function(){
varname=$(this).attr("name");
$("#iframe").attr("src",name).ready();
})
})
</script>
<ahref="#"id="a1"name="a1.html">1</a>
<ahref="#"id="a2"name="a2.html">2</a>
<iframesrc=""id="iframe"></iframe>
当点a1时在iframe里显示a1.html的内容，点a2时在iframe里显示a2.html的内容
二、iframe实现局部刷新的方法二
<ahref="a1.html"id="a1"name="a1.html"target="i">1</a> <ahref="a2.html"id="a2"name="a2.html"target="i">2</a> <iframesrc=""id="iframe"name="i"></iframe>
备注：<form>同样也有target属性，作用和<a>一样这个方式如果<from>或<a>提交到某个Action中再跳转到a1.html中效果一样，如果在Action中有req.set或session.set，最后在iframe中同样可以显示出来。
三：iframe实现局部刷新的方法三:
<iframesrc="1.htm"name="ifrmname" id="ifrmid"></iframe>
方案一:用iframe的name属性定位
<inputtype="button"name="Button"value="Button"onclick="document.frames('ifrmname').location.reload()">
或
<inputtype="button"name="Button"value="Button"onclick="document.all.ifrmname.document.location.reload()">
方案二:用iframe的id属性定位
<inputtype="button"name="Button"value="Button"onclick="ifrmid.window.location.reload()">
方案三:当iframe的src为其它网站地址(跨域操作时)
<inputtype="button"name="Button"value="Button"onclick="window.open(document.all.ifrmname.src,'ifrmname','')">
方案四:通过和替换iframe的src来实现局部刷新
可以用document.getElementById("iframname").src=""来进行iframe得重定向；
示例代码如下：test.html
<!DOCTYPEhtml>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title></title>
<scripttype="text/javascript">
functionpartRefresh(){
document.getElementById("iframe1Id").src="a2.html";//方法一:通过和替换iframe的src来实现局部刷新
}
</script>
</head>
<body>
<tableborder="1"width="90%"align="center">
<tr
style="background:#F0F0E4"><td>方格1</td><td>方格2</td><td>方格3</td>
</tr>
<tr>
<td>
<iframesrc="a1.html"id="iframe1Id"name="iframe1Name"width="100%"></iframe>
</td>
<td>
<iframesrc="a2.html"id="iframe2Id"name="iframe2Name"width="100%"></iframe>
</td>
<td>
<iframesrc="a3.html"id="iframe3Id"name="iframe3Name"width="100%"></iframe>
</td>
</tr>
</table>
<br>
<br>
<inputtype="button"value="IFRAME局部刷新"style="margin-left:70px;"onclick="partRefresh();">
</body>
</html>
以上内容给大家介绍了JavaScript中iframe实现局部刷新的几种方法汇总，希望大家根据自己的需求选择适合自己的，有任何问题欢迎给我留言，谢谢！