1. https://stackoverflow.com/questions/10237031/how-to-open-a-native-ios-app-from-a-web-app
    var frame = document.createElement('iframe');
  2. frame.src = 'myapp://?params=...';
  3. frame.style.display = 'none';
  4. document.body.appendChild(frame);
  5. setTimeout(function() { document.body.removeChild(frame); }, 4);
  6. 以上这个方案在唤起app时,当唤起不成功的时候不会有浏览器的默认行为,如果用href跳转的化就会有浏览器的弹窗提示的行为了
  1.  
  2. var preventDefault = function(e) {
    e = e || window.event;
    if(e.preventDefault) {
    e.preventDefault();
    }else{
    e.returnValue = false;
    }
    }
    preventDefault();
  3.  
  4. 以上的方法试过了,可以禁止手机上浏览器的弹窗的行为

https://segmentfault.com/a/1190000011231042

下面的方法没试过

Ios/Android h5 唤起本地APP

兰茗翔 2017年09月19日发布
  • 赞  |   4收藏  |  26
  • 2.3k 次浏览

纠结两天(浏览器中唤起本地APP),一直找不到解决方案,今天总算基本搞定。

ps:吐槽一下 魔窗那篇文章,为什么就不直接把js代码开源开源,混淆后的代码看得我好恼火

参考文章:魔窗解决方案京东解决方案

首先是判断浏览器

  1. // 判断浏览器
  2. var Navigator = navigator.userAgent;
  3. var ifChrome = Navigator.match(/Chrome/i) != null && Navigator.match(/Version\/\d+\.\d+(\.\d+)?\sChrome\//i) == null ? true : false;
  4. var ifAndroid = (Navigator.match(/(Android);?[\s\/]+([\d.]+)?/)) ? true : false;
  5. var ifiPad = (Navigator.match(/(iPad).*OS\s([\d_]+)/)) ? true : false;
  6. var ifiPhone = (!ifiPad && Navigator.match(/(iPhone\sOS)\s([\d_]+)/)) ? true : false;
  7. var ifIos = Navigator.match(/iPhone|iPad|iPd/i) ? true : false;
  8. var ifSafari = ifIos && Navigator.match(/Safari/);
  9. // ios 设备的版本号
  10. var iosVersion = Navigator.match(/OS\s*(\d+)/)
  11. iosVersion = iosVersion ? (iosVersion[1] || 0) : 0;
  12. // 安卓版本号
  13. var androidVersion = Navigator.match(/Android\s*(\d+)/)
  14. androidVersion = androidVersion ? (androidVersion[1] || 0) : 0;

android5 及以上的高版本

  1. // 延后50毫秒
  2. setTimeout(function() {
  3. location.href = ‘自定义 URL
  4. }, 50)

ios9 及以上的版本

  1. setTimeout(function() { // 必须要使用settimeout
  2. var a = document.createElement("a"); //创建a元素
  3. a.setAttribute("href", ‘自定义 URL’), a.style.display = "none", document.body.appendChild(a);
  4. var t = document.createEvent("HTMLEvents"); // 返回新创建的 Event 对象,具有指定的类型。
  5. t.initEvent("click", !1, !1) // 初始化新事件对象的属性
  6. a.dispatchEvent(t) // 绑定事件
  7. }, 0)

所有情况都用 iframe

  1. document.querySelector("#" + iframe).src = ‘自定义 URL // 将iframe增加src

计算时差的方案打开APP

  1. var checkOpen = function (cb){
  2. var _clickTime = +(new Date());
  3. function check(elsTime) {
  4. if ( elsTime > 3000 || document.hidden || document.webkitHidden) {
  5. cb(1);
  6. } else {
  7. cb(0);
  8. }
  9. }
  10. //启动间隔20ms运行的定时器,并检测累计消耗时间是否超过3000ms,超过则结束
  11. var _count = 0, intHandle;
  12. intHandle = setInterval(function(){
  13. _count++;
  14. var elsTime = +(new Date()) - _clickTime;
  15. if (_count>=100 || elsTime > 3000 ) {
  16. clearInterval(intHandle);
  17. check(elsTime);
  18. }
  19. }, 20);
  20. }
  21. checkOpen(function(opened){
  22. // APP没有打开成功 并且开启自动跳转到下载页
  23. if(opened === 0 && option.autoRedirectToDownloadUrl){
  24. location.href = downloadUrl;
  25. }
  26. });

app唤起的完美解决方案,及阻止浏览器的默认弹窗行为的更多相关文章

  1. js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...

  2. js 停止事件冒泡 阻止浏览器的默认行为(阻止a标签跳转 )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到"停止事件冒泡"和"阻止浏览器默认行为". 1..停止事件冒泡 JavaScript代码 //如果提供了 ...

  3. js 停止事件冒泡 阻止浏览器的默认行为(比如阻止超连接 # )

      在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ...

  4. js阻止浏览器的默认行为以及停止事件冒泡(用JQuery实现回车提交,兼容IE、FF浏览器) 转

    1.阻止浏览器的默认行为 function stopDefault(e) { //如果提供了事件对象,则这是一个非IE浏览器 if(e && e.preventDefault) { / ...

  5. js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 #)

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...

  6. js 停止事件冒泡 阻止浏览器的默认行为

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 浏览器默认行为: 在form中按回车键就会提交表单:单击鼠标右键就会弹出context menu. ...

  7. 如何阻止浏览器的默认事件,你是否也遇到过无法阻止Google默认事件的情况( 原生JS )

    如题,话不多话,我们先看怎么解决 根据不同的绑定事件的方法,我们有不同的阻止默认事件的方法 如果你不知到如何绑定事件,请查看我的上一篇文章 关于浏览器滚动的兼容性问题以及事件绑定 1.句柄绑定 只需要 ...

  8. javascript小实例,阻止浏览器默认行为,真的能阻止吗?支持IE和标准浏览器的阻止默认行为的方法

    看到这标题,是不是有点逆天的感觉,总感觉好狂拽炫酷,耳边隐隐约约传来一个声音:你这么叼,你咋不上天呢! ~~ 额,好吧! 话入正题,我为什么会提出这么一个问题呢? 阻止浏览器默认行为,真的能阻止吗?那 ...

  9. WebBrowser脚本错误的完美解决方案

    原文:WebBrowser脚本错误的完美解决方案   当IE浏览器遇到脚本错误时浏览器,左下角会出现一个黄色图标,点击可以查看脚本错误的详细信息,并不会有弹出的错误信息框.当我们使用WebBrowse ...

随机推荐

  1. Actor模型文章收集

    参与者模式——维基百科 Akka.Net——github开源项目 Actor原理——比较深入的文章

  2. 使用word文档直接发表博客 8 )

    目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...

  3. 关于Markdown格式转PDF格式

    Markdown转PDF格式 个人使用的Markdown编辑平台:有道云笔记网页版 当我们编辑好自己的随笔以后,在网页的[客户端下载]下面有一个[更多]的圆形图标选项,点击后在菜单中有一处[打印]选项 ...

  4. 软件加license的一种实现方法

    以前从没干过破解的勾当,这次确实必须要去破解一个,于是下了个反编译工具. 最终拿到反编译出来的文件,欣赏了一把它的license检测代码.原谅我的无知,以下代码在我看来还是比较新鲜,犬神请不要鄙视: ...

  5. 如何在github上上传readme文件

    首先打开记事本写好文字 然后保存为readme.md文件 打开github网页,登录自己的账号,选择右上角new repository 填写信息,勾选选项如下 创建好之后,选择upload files ...

  6. react学习笔记(1):从前后端分离到项目部署

    我来到现在这家公司有一年多的时间,一直做的是财政系统相关的产品,前端的技术栈用的是传统的jQuery+bootStrap+requireJs,随着项目的开发,越来越多的弊病凸显出来. 首先是前后端的代 ...

  7. jQuery基础入门

    一.什么是 jQuery Jquery它是javascript的一个轻量级框架,对javascript进行封装,它提供了很多方便的选择器.供你快速定位到需要操作的元素上面去.还提供了很多便捷的方法. ...

  8. 设置ArcGIS地图文档的数据源为相对路径

    ArcGIS中默认情况下,地图文档的数据源路径为绝对路径.在这种情况下,如果移动/拷贝地图文档及其数据源后,再次打开地图文档时,就看不到具体图层数据了(图层列表中图层前有“!”图标,并且无法查看图层数 ...

  9. C#文件和目录的操作

    根据文件名获取文件 /// <summary> /// 根据文件名获取文件 /// </summary> /// <param name="directory& ...

  10. nej+regular环境使用es6的低成本方案

    本文来自 网易云社区 . 希望在生产环境中使用es6/7,babel应该是最普遍的选择.这是babel官网中,它对自己的定义: Babel 自带了一组 ES2015 语法转化器.这些转化器能让你现在就 ...