美文网首页
artDialog v6 iframe 跨域请求

artDialog v6 iframe 跨域请求

作者: 1601 | 来源:发表于2016-08-11 19:17 被阅读152次

在iframe中,打开dialog加载子页面。

思路:
  • 父页面打开dialog,在子页面中写提交,获取当前dialog进行后续操作。
  • 父页面拿到子页面表单,在父页面提交,直接操作dialog完成后续动作。
问题:
  1. 子页面拿不到当前dialog。 文档中写道,父页面用 top.dialog()打开对话框,子页面用top.dialog.get(window)。父页面中top.dialog is not a function,换成window.dialog()能打开,但是子页面依旧拿不到对象。
  2. 在父页面的js里面直接拿子页面表单$("#form")无法拿到。
解决办法:

在2的基础上,不是用dialog自带的url请求子页面,而是用ajax请求,将请求到的页面填充进去,dialog.comtent(html)。可能是这样请求绕过iframe的跨域问题,可以直接拿到子页面的东西了。

新问题解决办法(2016-08-24):

artDialog+dataTables,采用上述方式加载dialog内容,会导致dataTables翻页无效,具体是dataTables对象失效。不得不尝试回归dialog自带的url请求内容。
重新仔细查看demo,发现之前遗漏了一句关键的JS——在包含iframe的index页面中,应该加上$(function(dailog){ window.dialog = dialog; });
所以,跨域的问题,解决步骤为:

1、iframe这一级的页面中写上 $(function(dailog){ window.dialog = dialog; });
2、iframe中的页面创建dialog, top.dialog({ url : 'url'});
3、dialog请求的url页面中,通过top.dialog.get(window);拿到对话框,进行操作。

相关文章

  • artDialog v6 iframe 跨域请求

    在iframe中,打开dialog加载子页面。 思路: 父页面打开dialog,在子页面中写提交,获取当前dial...

  • 跨域

    关于跨域大概可以分为 iframe 的跨域和纯粹的跨全域请求。 3种跨全域方法: 1、JSONP 全称:JSON ...

  • 跨域的解决方式与演示

    关于跨域大概可以分为 iframe 的跨域和纯粹的跨全域请求。 3种跨全域方法: 1、JSONP 全称:JSON ...

  • 利用form做跨域请求

    怎么做跨域请求? js+form+iframe 优点:跨域提交get和post的方式访问都是可以的 缺点:没有返回...

  • 页面内跨域解决方案

    除了浏览器请求跨域之外,页面之间也会有跨域需求,例如使用 iframe 时父子页面之间进行通信。postMessa...

  • 跨域的解决方案

    跨域的解决方案script,img,link,iframe,不存在跨域请求限制。1、JSONP, 客户端向服务器发...

  • iframe页面相互调用方法

    关键词:iframe,跨域,vue最近的项目中嵌入了外部的iframe,想跨域调用自己页面的方法,点击iframe...

  • Iframe高度自适应

    1. 同域iframe高度自适应 2. 跨域iframe高度自适应

  • 前端面试题

    1、有几种方式可以解决跨域请求? Jsonp、iframe、window.name、cors、img.src ht...

  • AJAX出现两次请求 options和get|post

    跨域请求 允许跨域请求 preflighted request预请求(options) 跨域请求 XMLHttpR...

网友评论

      本文标题:artDialog v6 iframe 跨域请求

      本文链接:https://www.haomeiwen.com/subject/xcsssttx.html