隐藏iframe实现局部刷新

最新推荐文章于 2022-10-24 14:14:52 发布

簆rht

最新推荐文章于 2022-10-24 14:14:52 发布

阅读量552

点赞数

分类专栏： ajax

ajax 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

也考虑过使用ajax来实现，
但实际当中(不明是由于跨域问题还是服务器端没设置好，另台服务器对简繁英版本进行切换操作时)该方法失败，便改用隐藏iframe来实现：即把刷新的动作交给了隐藏页面去操作，返回的结果通过js传给当前页面。

代码如下：
mainPage.aspx:
<script type="text/javascript">
function likeit(reviewid,type)
{
var hideID = "displayVote_" + reviewid;

document.getElementById(hideID).innerHTML = "<b>Thank you for your vote!</b>";

document.getElementById("ifAjax").src="ProfileReviewHidden.aspx?reviewid="+reviewid+"&type="+type+"&r=" + Math.random();

}
</script>
<body>
<form id="form1" runat="server">
<iframe id="ifAjax" name="ifAjax" style="display:none" src="about:blank"></iframe>
<div id="displayVote_<%#Eval("review_id") %>" style="height:20px;">
<div class="sz_btn_style4" style="float:right;">
<a href="javascript:;" onClick='likeit(<%#Eval("review_id")%>,"bad_qty")'>
<span>Don't like it!</span></a>
</div>
<div class="sz_btn_style4" style="float:right;">
<a href="javascript:;" onClick='likeit(<%#Eval("review_id")%>,"good_qty")'>
<span>I like it!</span></a></div>
</div>

<div style="clear:both; padding-top:4px;">
<label id="good_qty_<%#Eval("review_id") %>"><%#Eval("good_qty") %></label>/
<label id="sum_<%#Eval("review_id") %>" ><%#int.Parse(DataBinder.Eval(Container.DataItem, "good_qty").ToString()) + int.Parse(DataBinder.Eval(Container.DataItem, "bad_qty").ToString())%></label>
 like this post 
<label id="bad_qty_<%#Eval("review_id") %>" style="display:none;"><%#Eval("bad_qty") %></label>
</div>
</form>
</body>

hiddenPage.aspx:
<script type="text/javascript">
function getResult()
{
var result = document.getElementById("hiddenValue").value;
var type = document.getElementById("hiddenType").value;
var reviewid = document.getElementById("hiddenViewID").value;

parent.document.getElementById('reviewid').value = document.getElementById("hiddenValue").value;

var parentid = type + "_" + reviewid;
var parentsumid = "sum_" + reviewid;

//alert(parentid);
parent.document.getElementById(parentid).innerHTML = document.getElementById("hiddenValue").value;
parent.document.getElementById(parentsumid).innerHTML = document.getElementById("qtySum").value;

}
window.onload = getResult;
</script>
<body>
<form id="form1" runat="server">
<div>
<input id="hiddenValue" type="text" runat="server" />
<input id="hiddenType" type="text" runat="server" />
<input id="hiddenViewID" type="text" runat="server" />
<input id="qtySum" type="text" runat="server" />
</div>
</form>
</body>

hiddenPage.aspx.cs: 数据操作略

http://blog.163.com/dh_java@126/blog/static/34253108201031694542994/