|
|
本帖最后由 elhoog 于 2016-12-26 09:21 编辑
今天在APICloud论坛发现一个获取框架跳转后URL的方案，wex5是否有类似函数，或者是否可以开发类似函数出来？
以下是他们的解决方案：
http://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=14450
这个方法结合了 api.execScript、 api.sendEvent 以及 api.addEventListener。
步骤如下：
1. 在主页面中监听 getUrl 事件，并通过 api.openFrame 打开外部页面（此处是百度）；
apiready = function() {
var header = $api.byId("header");
$api.fixIos7Bar(header);
var headerPos = $api.offset(header);
api.addEventListener({
name: 'getUrl'
}, function(ret, err) {
if(ret && ret.value){
var value = ret.value;
api.alert({msg: value.location});
}
});
api.openFrame({
name: 'baidu',
url: 'http://www.baidu.com',
rect: {
x: 0,
y: headerPos.h,
w: 'auto',
h: 'auto'
}
});
};
复制代码
2. 等页面加载完毕，点击主页面的 “获取 url” 的按钮，触发 getFrameUrl 方法
<button class="action" tapmode>获取url</button>
复制代码
function getFrameUrl() {
var script = "api.sendEvent({name: 'getUrl', extra: {location: window.location}});";
api.execScript({
frameName: 'baidu',
script: script
});
}
复制代码
该方法使用 api.execScript 在打开的页面中执行
"api.sendEvent({name: 'getUrl', extra: {location: window.location}});"
复制代码
从而，将页面的 locaction 信息通过 getUrl 事件发送了出去。
3. 主页面监听到了getUrl 事件，于是我们就获得了外部页面的 location 信息（location.url 包含了 url 信息）。
需要注意的是：
在初次打开页面的时候，需要等待 APICloud 的 api 加载完毕。
如果在打开页面的时候，立即点击 “获取 url” 的话，由于此时 api 不存在，是得不到所需要的信息的。
最后，完整的示例代码如下：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<title>test</title>
<link rel="stylesheet" type="text/css" href="../css/api.css">
<style>
#header {
height: 44px;
line-height: 44px;
background-color: green;
position: relative;
}
.back {
background-color: white;
display: inline-block;
margin-left: 10px;
padding: 5px 10px;
}
.action {
background-color: white;
margin: 10px 10px 0 0;
padding: 5px 10px;
float: right;
}
</style>
</head>
<body>
<div id="header">
<button class="back" tapmode>返回</button>
<button class="action" tapmode>获取url</button>
</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
apiready = function() {
var header = $api.byId("header");
$api.fixIos7Bar(header);
var headerPos = $api.offset(header);
api.addEventListener({
name: 'getUrl'
}, function(ret, err) {
if(ret && ret.value){
var value = ret.value;
api.alert({msg: value.location});
}
});
api.openFrame({
name: 'baidu',
url: 'http://www.baidu.com',
rect: {
x: 0,
y: headerPos.h,
w: 'auto',
h: 'auto'
}
});
};
function getFrameUrl() {
var script = "api.sendEvent({name: 'getUrl', extra: {location: window.location}});";
api.execScript({
frameName: 'baidu',
script: script
});
}
</script>
</html>
复制代码
|
|
[复制链接]
IP卡
狗仔卡
发表于 2016-12-24 11:57:20
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
显身卡
楼主