LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

你的无刷新技术是用的Ajax还是iframe？
admin
2011年1月22日 21:37 本文热度 2808
15.38% (2)
 23.08% (3)
 61.54% (8)
您所在的用户组没有投票权限
本帖最后由 我为ぁ琴狂 于 2010-8-22 11:44 编辑

现在我碰到一些问题很纠结：
1，全都用Ajax，文件上传可以用flash上传，但是Ajax提交表单总感觉挺麻烦的
2，全都用iframe，似乎不能符合W3C文档标准（不知道怎样去符合）
3，一般用Ajax，文件上传用iframe，这个discuz就是这样做的

iframe替代ajax方案：
1.html
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. <title>无标题文档</title>
  6. <script type="text/javascript">
  7. function ajax(settings) {
  8.     var div = document.createElement("div"), successed = false, iframeId = "i" + new Date().getTime();
  9.         div.style.display = 'none';
  10.     div.innerHTML = '<iframe id="' + iframeId + '" name="' + iframeId + '"></iframe>';   
  11.         document.body.appendChild(div);
  12.         
  13.         var hiddenIframe = document.getElementById(iframeId);

  15.         if(settings.form) {
  16.             settings.form.action = settings.url;
  17.             settings.form.target = iframeId;
  18.             settings.form.submit();
  19.         } else {
  20.             hiddenIframe.src = settings.url;
  21.         }
  22.         
  23.         var fetchData = function() {
  24.             var doc = document.all ? window.frames[iframeId].document : hiddenIframe.contentDocument;
  25.             settings.callback(doc.body.innerHTML);
  26.                 successed = true;
  27.         }
  28.    
  29.         settings.loader();

  31.     setTimeout(function() {
  32.         if(!successed) {
  33.             alert('Resquest timeout!');
  34.             fetchData = new Function();
  35.         }
  36.     }, settings.timeout);

  38.         if (document.all){
  39.                 hiddenIframe.attachEvent("onload", fetchData);
  40.         } else {
  41.                 hiddenIframe.onload = fetchData;
  42.         }
  43. }

  45. function A() {
  46.         ajax({
  47.             form: document.getElementById('f'),
  48.                 url: '1.php',
  49.                 loader: function() {},
  50.                 timeout: 3000,
  51.                 callback: function(data) {
  52.                         alert(data);
  53.                 }
  54.         })
  55.         return false;
  56. }
  57. function B() {
  58.         ajax({
  59.                 url: '1.php',
  60.                 loader: function() {},
  61.                 timeout: 3000,
  62.                 callback: function(data) {
  63.                         alert(data);
  64.                 }
  65.         })
  66.         return false;
  67. }
  68. </script>
  69. </head>
  70. <body>
  71. <form id="f" method="post" onsubmit="return A()">
  72. <input type="text" name="word" value="123" />
  73. <input type="submit"/>
  74. </form>
  75. <button onclick="B()">get_send</button>
  76. </body>
  77. </html>
复制代码
1.php
  1. <?php
  2. echo json_encode(array($_POST))
  3. ?>
复制代码

该文章在 2011/1/22 21:37:11 编辑过

全部评论3
admin
2011年1月22日 21:37
搜到的一些高手的见解 到现在ajax碰到的两个比较大的问题是 1）中文乱码，这个貌似是编码的问题，基本上能够解决，但是在某些比较低版本的浏览器中还是会出现一些问题 2）跨域post提交数据，这个貌似没有办法直接实现，只能通过代理或其他方式来实现 而这两个问题iframe基本都不会碰到，但是iframe的问题在于 1）你想同时进行多少个请求，就必须建立多少个iframe～否则无法同时进行 2）iframe的方式处理的是iframe页面的内容，交互成功的触发方式主要靠a)页面定时读取页面加载状态;b)iframe触发父页面的事件。a)方式必然导致对客户端资源的较多占用，b)方式导致返回数据的增加，而且必须保证父页和框架页的变量和方法的统一。而这点上面，ajax交互过程中仅仅返回所需要的数据(xml或者text)，这个是ajax相比iframe的最大优势之一。 当然，有些简单的交互过程，或许用iframe解决会简单一些，例如我的站点有多个频道，采用二级域名布局，这时候如果在a域名下要将数据post到b域名下，如果用ajax处理起来可能会很麻烦，但是iframe很简单就能实现了 至于实际应用中，用iframe还是ajax，看实际需求和个人喜好吧～～ 在有的地方比如点击出现一个浮动操作窗口，用iframe比用ajax方便的多。个人感觉用户体验比ajax还要好，ajax总有顿一下的感觉，iframe的方式响应非常快。但是一点击浏览器的后退按钮就露马脚了，用iframe会把每次操作当作一次点击链接记录到历史记录中。ajax还能做很多其它iframe做不了的事

该评论在 2011/1/22 21:37:46 编辑过
admin
2011年1月22日 21:39
哥用ajax用的很少,几乎不怎么用,适当用用还是有益的,用多了就有些过度依赖了

该评论在 2011/1/22 21:39:04 编辑过
admin
2011年1月22日 21:39
什么方便就用什么

该评论在 2011/1/22 21:39:21 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理，结合码头的业务特点，围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体，是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费，不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved