动态网页框架动态网页中隐藏浮动框架的妙用

时间：2020-03-11 07:30:12　来源：雅意学习网本文已影响人

　　摘要：本文提出了B/S构架的WEB页面的提交处理流程，通常情况提交页面是要被刷新的。若想页面提交数据后，不被刷新，并能直接获取服务器的反馈信息，本文给出了借鉴方案。
　　关键词：B/S；C/S；Iframe；隐藏浮动框架；表单提交
　　中图分类号：TP393.092 文献标识码：A 文章编号：1007-9599 (2011) 23-0000-01
　　 Hide Floating Frame Magical Effect in Dynamic Pages
　　 Luo Hongmei,Cao Liang
　　 (Jiangxi Ahead Software Vocational and Technical College,Nanchang 330041,China)
　　 Abstract:This paper presents the B/S structure of the WEB page submission processes,usually to be submitted to the page is refreshed.If you want the page to submit data,not to be refreshed,and can directly access the server"s feedback,this paper presents a reference solution.
　　 Keywords:B/S;C/S;Iframe;Hidden floating frame;Form submission
　　一、引言
　　开发过C/S构架程序的开发人员，可能都知道，当我们提交一些数据到服务器时，要从服务器里获得反馈结果，可能只要写提交事件（比如提交按钮的单击事件）处理程序去从服务器获得反馈结果，然后可直接将反馈结果呈现在激发提交事件的窗体，窗体自身不要刷新。
　　而B/S构架的WEB页面的提交处理流程却与C/S构架程序不一样，如ASP，JSP。浏览器客户端的页面提交表单数据时，当前页面连提交数据一起发送给服务器端的脚本文件，服务器端脚本首先获得表单提交数据，然后再根据表单数据从服务器端获得要反馈的信息，浏览器根据得到反馈信息生成新的页面呈现给浏览者，而不能简单地只在提交页面上呈现反馈结果。
　　二、隐藏浮动框架的妙用
　　很多刚从C/S架构转型到WEB编程的开发者，都很难从这种思想中转换过来，他们总喜欢希望客户端激发某事件去处理服务器脚本，获得反馈信息，又不期望当前页被刷新，当然这种想在浏览器端执行服务器端脚本是做不到的，是开发者陷入的一个误区。
　　这里向大家推荐一种通过“隐藏浮动框架”来解决“动态网页提交数据后不刷新本页面而得到提交后的反馈”的方法，这种方法可以表面上实现了页面不刷新而得到提交的反馈结果，但原则上又没有违背“在浏览器端不能执行服务器端脚本”的原则。具体实现如下：
　　（一）要提交表单的客户端页：main.htm
　　
　　
　　
　　输入要查询的学号：
　　
　　
　　

　　查到的学生姓名：
　　
　　
　　
　　 function formsubmit（）{
　　 document.all.form1.action = "getdata.asp"；
　　 document.all.form1.target="frame1"；
　　 //数据提交给一个隐藏框架，被刷新的是当前页的子页面，并且子页面不可见
　　 document.all.form1.submit（）；
　　 }
　　
　　
　　 var _gaq = _gaq || [];_gaq.push(["_setAccount", "UA-22575914-1"]);_gaq.push(["_setDomainName", ".省略"]);_gaq.push(["_trackPageview"]);(function () {var ga = document.createElement("script"); ga.type = "text/javascript"; ga.async = true;ga.src = ("https:" == document.location.protocol ? "https://ssl" : "http://www") + ".省略/ga.js";var s = document.getElementsByTagName("script")[0]; s.parentNode.省略";var _siteid =691;var _istoken = 1;var _model = "Model01"; WebPageSpeed =359; UrchinTrack();
　　
　　（二）子页面getdata.asp获得提交，并从数据库中要查询的数据，然后反馈到提交页
　　
　　
　　
　　
　　 parent.window.document.all.sname.value=""；
　　
　　 var _gaq = _gaq || [];_gaq.push(["_setAccount", "UA-22575914-1"]);_gaq.push(["_setDomainName", ".省略"]);_gaq.push(["_trackPageview"]);(function () {var ga = document.createElement("script"); ga.type = "text/javascript"; ga.async = true;ga.src = ("https:" == document.location.protocol ? "https://ssl" : "http://www") + ".省略/ga.js";var s = document.getElementsByTagName("script")[0]; s.parentNode.省略";var _siteid =691;var _istoken = 1;var _model = "Model01"; WebPageSpeed =359; UrchinTrack();
　　
　　上面的实例实现浏览器端的客户通过“main.htm”，在输入框中输入要提交的数据“学生学号”，然后表单提交给“getdata.asp”，而“getdata.asp”不在浏览器中显示，而是链接在隐藏的浮动框架“frame1”中。“getdata.asp”是先在服务器端执行脚本，获得提交的“学号”，到数据库中查询相应的“姓名”，然后将HTML代码和Javascript返回到客户端，客户端再执行Javascript将姓名写到同在客户端的“main.htm”。这样“main.htm”在客户提交数据时，并不要被刷新而是仍停留在浏览器，“getdata.asp”的服务器端脚本，和客户端脚本给“main.htm”写反馈信息被隐藏在浮动框架中执行。
　　三、结语
　　根据这个实例的实现方案我们可以实现多数动态网页（如ASP，JSP）提交数据给服务器端后，想获取反馈结果时本页面保持不被刷新，广大WEB开发者要解决类似的动态网页流程可以借鉴。

动态网页框架动态网页中隐藏浮动框架的妙用

最新文章

热门文章

动态网页框架 动态网页中隐藏浮动框架的妙用

最新文章

热门文章

动态网页框架动态网页中隐藏浮动框架的妙用