美文网首页IonicCordova
ionic——iframe嵌入网页

ionic——iframe嵌入网页

作者: 一只飞 | 来源:发表于2017-09-05 17:35 被阅读0次

2017/9/27更新:ios兼容问题:
1)input输入框无法输入的问题:
ionic.css把-webkit-user-select:none改成-webkit-user-select:auto;
2)iframe滚动条失效:重点加了个div
<div style="overflow:auto;-webkit-overflow-scrolling:touch;height: 100%;width: 100%;"> <iframe id="" name="" data-tap-disabled="true" style="height:100%;width:100%;" ng-src=""></iframe> </div>

原:
ionic有个插件plugin add cordova-plugin-inappbrowser也可以查看网页,
但是,它会跳出app,弹出一个浏览界面,不是嵌入。
iframe:
<iframe id="iframeID" data-tap-disabled="true" style="height:100%;width:100%;" ng-src="{{paySrc}}"></iframe>
1、使用ng-src和$scope.paySrc = $sce.trustAsResourceUrl(url);这个都知道的,
使地址受信任。
2、data-tap-disabled="true"使网页能够被点击(好像是这个意思)。
3、获取iframe中页面地址。
parent.document.getElementById("iframeID").contentWindow.location.href
iframe上一页
self.history.back(-1);
4、父子页面跨域(完全跨域)通讯问题(互调方法等)
http://www.cnblogs.com/dolphinX/p/3464056.html
*注意:window.addEventListener没有找到取消监听的方法,所以不要多次触发监听;
5、页面缓存:加个时间戳属性
var url = "http://aaa/index.php?time=" + (new Date()).getTime();

*再次注意:iframe中网页的页面跳转不能开新的窗口(打不开),即:_blank;

相关文章

  • ionic——iframe嵌入网页

    2017/9/27更新:ios兼容问题:1)input输入框无法输入的问题:ionic.css把-webkit-u...

  • 谈谈iframe的优缺点

    iframe是一种框架,也是一种很常见的网页嵌入方式 iframe的优点: 1.iframe能够原封不动的把嵌入的...

  • 对iframe的了解?

    iframe的优点: 1.iframe能够原封不动的把嵌入的网页展现出来。 2.如果有多个网页引用iframe,那...

  • iframe有哪些缺点?

    iframe的优点:1.iframe能够原封不动的把嵌入的网页展现出来。2.如果有多个网页引用iframe,那么你...

  • 【转】ionic调用外部网页

    ionic调用外部网页示例 Ionic是单页应用,有时候需要处理外网页面,可以使用iframe标签 特别说明: 1...

  • 28.iframe标签 29.ES6的Promise对象?

    28.iframe标签 (1)优点 iframe能够把嵌入的页面展示出来,如果有多个网页引用iframe,只需要修...

  • 2021-01-26面试题

    iframe框架都有哪些优缺点? iframe 是一种框架,也是一种常用的网页嵌入式 iframe优点 ifra...

  • HTML面试题

    1.iframe有哪些缺点? iframe是一种框架,也是一种很常见的网页嵌入方式。 「iframe的优点」 if...

  • [html] iframe嵌入网页

    不允许被其他网站使用iframe嵌入

  • grafana和prometheus系列三:grafana性能监

    一、接入node-exporter 二、更改grafana配置文件,使得允许外部网页Iframe嵌入grafana...

网友评论

    本文标题:ionic——iframe嵌入网页

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