背景：
该项目为h5游戏平台，游戏方的页面通过iframe展示，支付使用的是我们自己的收银台，集成了微信h5支付、微信公众号支付、微信pc端扫码支付、支付宝、
银联，支付流程为游戏内点击支付后调用我们接口，我们接口再重定向到收银台页面，此时一直在iframe内。
问题：
- safari内无法跳转微信app，能自动从iframe内跳转到最外层，以及跳转微信的链接，但不能掉起微信
- 支付宝支付，提示右上角safari打开，打开的是外层链接，非iframe链接，无法正常使用
- 在安卓微信，iframe里面不能调用公众号支付
解决：
一开始将微信支付的链接跳转由window.location.href改为top.location.href，解决了问题3
后来直接将iframe内的链接重定向到最外层
if(top.location != location) {
top.location.href = location.href;
}
但safari还是无法跳转微信app，分析发现，从iframe跳到最外层这一操作必须由用户点击触发，自动跳转不行
接下来考虑如何让用户多点一下，默认选中银联让用户去改，或是点两次立即支付按钮
现在是在safari里面默认选中银联，用户点击任意支付方式后，页面重定向到最外层，然后再点立即支付
if(top.location != location) {
if((/Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent))) {
//这里选中银联
}else{
top.location.href = location.href;
}
}
奇怪的是用户本身有一次在iframe最外层点击支付按钮的行为，为啥不行呢？
2018年9月21日 11:04:22 优化
改为点击底部支付按钮后，iframe跳转到最外层，并将选中的支付渠道传出来，然后自动点击支付渠道，以及自动点击支付按钮，这样用户也就只有一次点击操作；注意自动点击click()的时候，需要放到最底部，保证dom元素已经生成，以及事件都已绑定;
也就无需判断浏览器，全部都统一处理了；再就是今天发现qq浏览器更新后，上面那段检查出来也是safari了；
$('#goPay').click(function() {
try {
if(top.location != location) {
var href = location.href
href = href.indexOf('?') > -1 ? href + '&jumpout=' + (++payMethod) : href + '?jumpout=' + (++payMethod)
//jumpout从iframe中跳出，参数为1、2、3，对应3种支付，有0的话后面不能直接用if判断，不然也是false；注意++放到前面
top.location.href = href;
}
} catch(e) {
console.log(e)
}
...
...
})
//如果有jumpout，表示从iframe中跳出，则自动选中然后自动点击支付
//需要放到最底部，保证dom元素已经生成，以及事件都已绑定；注意--放到前面
if(jumpout) {
$('.pay-method').eq(--jumpout).click()
$('#goPay').click()
}
ps：
"location.href"是本页面跳转
"parent.location.href"是上一层页面跳转
"top.location.href"是最外层的页面跳转
a标签的target
_blank：重新打开一个窗口
_parent：父窗口执行重定向
_self：自身页面重定向
_top:第一个父窗口重定向
网友评论