`
yuzihan607
  • 浏览: 21139 次
  • 性别: Icon_minigender_1
  • 来自: 雅安
社区版块
存档分类
最新评论

dojo入门5_iframe

    博客分类：
  • dojo
阅读更多
前面学习了使用dojo的XHR对象去进行ajax交互，而dojo提供了另外的一种并不依靠XHR对象的交互方式，使用io模块的iframe可以完成同样的功能
<html><body>
<script src="../dojo/dojo/dojo.js"
   djConfig="parseOnLoad: true"></script>
<script>
dojo.require("dojo.io.iframe" );
function iframeTest(){
dojo.io.iframe.send({
form: dojo.byId('testForm') ,
url: "data.jsp" ,
method: "post" ,
handleAs: "html" ,
load: function(response, ioArgs) {
alert(response);
}
});
}
</script>
<form id="testForm" method="post" >
Name:<input type="text" name="name" size="40" /><br />
Sex:<input type="radio" name="sex" value="m" >
Male<input type="radio" name="sex" value="f"> Female<br />
<input type="button" name="sub" value="submit" onclick="iframeTest()" />
</form>
</body></html>

iframe的send方法的参数仍然是一个json对象，而且参数名跟前面的xhrGet方法参数的json对象参数名很类似，但是注意一点，handleAs属性的值大部分是html,因为iframe中本来就是保存的一个html页面，如果使用的是其他类型，如text,jsong等，则在服务器端必须使用 <textarea></textarea> 把要返回的数据包装起来，比如 hello, world 要被包装成 <textarea>hello,world</textarea>，所以最后存在 iframe 中的是一个文本域（textarea），这个文本域包含了从服务器端返回的数据。这么做的原因很简单，就是为了保持从服务器返回的数据“一成不变”，因为任何字符数据都可以“安全的”放在 HTML 页面的文本域中。想像一下，我们是不是可以在文本域中输入各种字符！ dojo.io.iframe 会对 textarea 包装的数据进行处理：首先把 textarea 标签去掉，然后把数据转换为 handleAs 指定的类型传递给 handle中设置的回调函数。

dojo.io.iframe 是如何工作的呢？除了 XHR 对象之外还有什么方法可以实现表单的异步提交？其实这一切都很简单，dojo.io.iframe 首先会创建一个隐藏的 iframe 并插入到父页面的最后，然后设置此 iframe 的 src 属性为dojo-module-path/resources/blank.html（dojo-module-path 指 dojo 包所在的目录），iframe 页面的 onload 事件的处理函数被设置为父窗体的回调函数。接下来就是在 iframe 页面中发送请求，并接收服务器的响应。当 iframe 接收到服务器的反馈并加载完之后，父窗体的回调函数即被调用。
分享到：
| dojo入门4_ajax
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics