`

iphone web页跳转回app应用处理

    博客分类:
  • IOS
 
阅读更多

1. 获悉IOS应用的CFBundleURLSchemes(plist文件里面含有)

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<array>
	<dict>
		<key>CFBundleTypeRole</key>
		<string>Editor</string>
		<key>CFBundleURLName</key>
		<string>com.fanxer.crazylottery</string>
		<key>CFBundleURLSchemes</key>
		<array>
			<string>demo</string>
		</array>
	</dict>
</array>
</plist>

 

2. javascript的使用

<script type="text/javascript">
var id;
function reback(status){ 
          window.location.href = "demo:"+status;
          if (id  != undefined) {
                window.clearTimeout(id); 
          }
          id = window.setTimeout('windowclose()',3000); 
}
function windowclose(){ 
          window.open('','_self');
          window.close();
}
</script>

 

业务需求是,跳回demo应用后,3秒钟后关闭当前页面

 

3秒退出,解决ios 8.1.1直接关闭,不执行跳转到应用功能

ios 8.1.0 不支持window.close()方法,所有无效

 

3. demo页面

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html>
<head>
<title>demo</title>
<meta http-equiv="Content-Type" name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0;charset=utf-8;application/vnd.wap.xhtml+xml" />
<meta HTTP-EQUIV="pragma" CONTENT="no-cache"/> 
<meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"/> 
<meta HTTP-EQUIV="expires" CONTENT="0"/> 
</head>
<script type="text/javascript">
var id;
function reback(status){ 
          window.location.href = "demo:"+status;
          if (id  != undefined) {
                window.clearTimeout(id); 
          }
          id = window.setTimeout('windowclose()',3000); 
}
function windowclose(){ 
          window.open('','_self');
          window.close();
}
</script>
<style type="text/css">   
@media not screen and (orientation:portrait){
body{color:#f00;}
}
body,div,p,form{
padding:0;
margin:0;
font-size:18px;
}
.tip-title{
font-size:22px;
font-weight:100;
}
.font-lottery-type{
font-size:25px;
font-weight:100;
margin-bottom:17px;
}
.font-18{
font-size:18px;
font-weight:100;
margin-bottom:10px;
}
.font-20{
font-size:20px;
font-weight:100;
}
body{
padding: 5px 0 2px 0;
line-height:20px;
}
img{
border:none;
vertical-align:-20%;
}
strong{
font-weight:bolder;
}
a{
color:#0077FF;
text-decoration:underline;
}
a:hover{
color:#ffffff;
background-color:#3796FF;
}
input[type="submit"], input[type="reset"], input[type="button"], 
button { -webkit-appearance: none;}
.ap-noline{
line-height:14px;
}
.ap-c-black{
color:#000000;
}
.ap-c-gray{
color:#999999;
}
.ap-c-orange{
color:#ff9900;
}
.ap-c-red{
color:#ff0033;
}
.ap-c-green{
color:#00CC00;
}
.ap-cb-gray{
background-color:#F2F2F2;;
}
.ap-cb-red{
background-color:#9a0000;
}
.ap-a{
color:#ffffff;
line-height:36px;
padding:4px;
height:36px;
}
.ap-b{
color:#000000;
line-height:16px;
padding:4px;
}
.b-hr{
border-top:1px solid #AEAEAE;
}
.ap-hr{
border-bottom:1px solid #AEAEAE;
}
input.checkbox,input[type=checkbox],input[type=radio]{
padding:0;
margin-right:4px;
cursor:pointer;
vertical-align:middle;
vertical-align:-20%;
}
.ap-left{
margin-left: 5px;
line-height:18px; 
}
.ap-top{
//                border:1px solid #000000;
//                margin-left: 2px;
height:100%;
width:320px;
}
.btn{
font-size:18px;
width:140px;
height:36px;
background-color:#9a0000;
color:#ffffff;
border:0;
}
.title-po{
position: relative;
  top: -20%;
}
</style>   
<body>
<div align="center">
     <div class="ap-top" style="text-align:left;">
          <div class="ap-a  ap-hr ap-cb-red tip-title" align="center">
             Demo例子
          </div>
          <div class="ap-b ap-left ap-noline" 
style="height:70px;vertical-align:middle;text-align:position;" >
          <span class="ap-c-green font-lottery-type title-po" >欢迎您使用,Demo例子</span><br />
          </div>
          
          <div class="b-hr" />
          <div class="ap-b ap-left ap-noline">
          <br />
          Demo test<br /><br />
          <span class="ap-c-green"></span><br />
          <div  align="center"> 
          <span align="center"> <input type="button" value="返回Demo" onclick="javascript:reback(1);"
 class="btn" style="background-color:#d9d9d9;border:1px solid #aaaaaa;color:#333333"  /> </span>&nbsp;
          <span align="center"> <input type="button" value="继续Demo的某个页" 
class="btn" onclick="javascript:reback(2);"  /> </span><br/>
        </div>
          </div>
     </div>
     </div>

</body>
</html>

 

 

 

分享到:
评论

相关推荐

    网页跳转APP

    网页跳转APP是一种常见的技术手段,它允许用户在浏览网页时无缝地过渡到移动应用程序,提升用户体验并促进APP的推广。这一过程涉及到多种技术,主要包括JavaScript的环境检测、URL schemes和深度链接等。 首先,...

    微信打开外部链接下载APP引导

    在移动互联网时代,微信作为一款超级应用,拥有庞大的用户基数,很多开发者希望能在微信内实现直接跳转到外部链接并引导用户下载APP。本话题主要探讨如何在微信环境中实现这一功能,同时兼容安卓(Android)和苹果...

    移动app测试的22条军规

    1. **App切换处理**:当用户在多个应用间切换时,检查应用是否能正确保存状态并在返回后继续之前的活动。 2. **恢复**:确保应用能够在中断后恢复到用户离开前的状态,比如恢复未完成的任务。 #### 五、手势操作 1....

    苹果手机app应用网站模板

    设计师通常会使用Adobe Photoshop、Sketch或其他Web设计工具来处理这些文件,构建出符合要求的App应用网站。 总的来说,苹果手机App应用网站模板的设计需要综合考虑用户体验、视觉吸引力、功能展示以及技术实现,以...

    TP5框架页面跳转样式操作示例

    页面跳转是Web应用中常见的功能,它用于在用户完成某些操作后,引导用户到新的页面或者展示特定的提示信息。TP5提供了一套便捷的机制来实现这一目的。 首先,我们注意到在描述中提到了一个`isMobile()`函数,这个...

    使用苹果手机必须了解的24条iPhone4的使用小技巧和窍门.pdf

    【使用苹果手机必须了解的24条iPhone4的使用小技巧和窍门】 1. **导入电话本**:购买新iPhone 4后,首先要激活设备,通过数据线连接电脑和iTunes完成。若想从其他品牌手机(如诺基亚、三星)导入通讯录,可先将...

    iphone使用说明

    iPhone支持安装各种应用程序,包括预装的应用和从App Store下载的应用。 **自定主屏幕** 用户可以根据自己的喜好定制主屏幕布局,例如调整应用程序图标的位置。 **键入** iPhone提供了虚拟键盘,支持触控输入...

    html5唤起app的方法

    HTML5唤起App的方法是移动互联网中一个重要的技术实践,它使得Web页面能够直接启动已安装的移动应用程序,从而提供无缝的用户体验。本文将详细介绍三种常见的HTML5唤起App的方案,并结合实际测试结果进行分析。 ...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    SSH 为 Struts+Spring+Hibernate的一个集成框架,是目前较流行的一种Web应用程序开源框架。其中使用Struts作为系统的整体基础架构,负责MVC的分离,在Struts框架的模型部分,控制业务跳转,利用Hibernate框架对持久...

    用xcode11打包app H5判断ipadpro机型 navigator.userAgent

    需求想要的效果是 web/wap自动跳转,ipad归于wap跳转H5页面 新版app升级Xcode11来打新包出现ipadPro 不识别是ipad机型 首先ipadPro本来就是一个特殊机型!!(神坑) 用navigator.userAgent方法打印下面一堆 下图是...

    angularJS;chromeiphone6;模拟书城

    在本项目中,我们主要探讨的是使用AngularJS框架构建一个模拟书城的Web应用,该应用能在Chrome手机模拟器上以iPhone6的样式展示,并具备购物功能,包括商品的购买、删除和添加。我们将深入讨论AngularJS的核心特性,...

    HTML5app:基本JQueryMobile的iOS端HTML5网页

    项目的描述提到了"iPhone模拟器运行列表首页"和"HTML5详情页面",这表明应用有列表视图和详细视图两种界面。在JQuery Mobile中,可以使用数据-attr来创建可点击的列表项(listview),点击后通过页面导航跳转至详情...

    framework7- for IOS

    3. **页面和路由管理**:Framework7 提供了基于页面的路由管理,允许开发者轻松地在不同的应用页面之间跳转,同时处理页面之间的数据传递。 4. **JavaScript MVC框架**:尽管名为"Framework7",但它其实是一个轻量...

    百度判断手机终端并自动跳转js代码及使用实例

    百度提供的js脚本能够帮助站长和web开发人员判断用户所用的手机终端类型,并根据判断结果自动实现从手机站到WEB站的跳转。这大大方便了用户操作,提升了用户体验。这种技术通常用于响应式网页设计中,使网站能够根据...

    react移动端H5点餐项目源码首页,商品列表,商品详情,商品购物车汇总.zip

    这个React移动端H5点餐项目源码是一个基于React框架构建的Web应用,旨在提供一个功能齐全的在线点餐系统。项目包含多个关键组件和功能,适用于iPhone、主流Android设备以及各种Web浏览器。以下是对该项目各个组成...

    分享两个手机访问pc网站自动跳转手机端网站代码

    在实际应用中,这些代码可以集成到网站的HTML头部,以便在用户加载页面时立即执行检测和跳转。为了防止循环跳转,通常会在URL中添加参数,如"?pc"或"?mobile",以便在跳转前检查。 需要注意的是,这种方法虽然方便...

    第三代移动WEB内核小程序风口-逐浪CMS2 x3.9.3全面发布

    ■建站:模板增加预览功能(PC,iPad,iPhone) ■建站:使用新的编辑器替代ckeditor ■建站:版块数据管理功能(content|image等) ■修复:UEditor编辑器,图片上传Bug ■修复:模型字段,设置为前端不显示时,后台内容管理...

    php判断手机浏览还是web浏览,并执行相应的动作简单实例

    文件示例中的代码根据`isMobile`函数的返回值,决定是跳转到`./app/index.php`(针对手机访问)还是跳转到`./web/index.php`(针对非手机访问)。 6. 可用技术的扩展:虽然上述示例代码对于基本的手机与Web浏览器的...

    基于VUE实现判断设备是PC还是移动端

    在现代Web开发中,适配不同设备已经成为必不可少的技能,特别是在...这不仅可以优化用户体验,也是构建跨平台Web应用的重要步骤。在实际开发中,还可以结合CSS媒体查询、Bootstrap等响应式框架进一步完善设备适配策略。

Global site tag (gtag.js) - Google Analytics