我有一个在Safari上运行正常的网络应用程序。在ipad / iphone上将其添加到主屏幕后，存在一个不一致的问题，即在以网络剪辑模式启动时，应用程序显示空白的白色屏幕。
我尝试使用Mac使用Web控制台进行调试，但未发现任何控制台错误或网络活动。我最初的猜测是文件加载时间，但网络选项卡会在这种情况下显示此活动。
无法追踪任何模式，因为它不一致，但是在我将它闲置一段时间之后第一次在iphone上注意到了。清除缓存并再次运行应用程序无济于事。
在ios 7.0.x和7.1.x设备中都看到了这一点。阅读一些文章，说ios 7上的网络剪辑模式是错误的，但没有真正指出上述问题。
我打算发出警报，检查是否有任何执行。
有人可以帮助解决问题/解决方案吗？
按要求添加代码 添加index.html代码：
<html>
<head>
<title>XYZ</title>
<meta charset="UTF-8">
<!-- to avoid caching especially in webclip -->
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
<meta name="viewport" content="width=320, initial-scale=1.0, user-scalable=no" />
<!-- <meta name="apple-mobile-web-app-capable" content="yes">-->
<!-- Bookmark Icons -->
<link rel="apple-touch-icon" sizes="57x57" href="css/images/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="css/images/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="css/images/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="css/images/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="css/images/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="css/images/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="css/images/favicons/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="css/images/favicons/apple-touch-icon-152x152.png">
<meta name="apple-mobile-web-app-title" content="Health eCircle Patient">
<link rel="icon" type="image/png" href="css/images/favicons/favicon-196x196.png" sizes="196x196">
<link rel="icon" type="image/png" href="css/images/favicons/favicon-160x160.png" sizes="160x160">
<link rel="icon" type="image/png" href="css/images/favicons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="css/images/favicons/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="css/images/favicons/favicon-32x32.png" sizes="32x32">
<link rel="apple-touch-startup-image" href="css/images/favicons/startup.png">
<meta name="application-name" content="Health eCircle Patient">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="mobile-web-app-capable" content="yes">
<!-- Bookmark Icons:end -->
<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<!-- <link rel="apple-touch-icon" href="img/icons/health-ecircle-app-icon-tablet-ipad.png">-->
<!-- CSS section start-->
<link rel="stylesheet" href="css/libs/lib-all.css" />
<link rel="stylesheet" href="css/dist/knugget.min.css" />
<!-- CSS section End-->
<!-- JS section start -->
<script src="js/libs/lib-all.js" type="text/javascript" ></script>
<script src="js/dist/knugget.min.js" type="text/javascript" ></script>
<!-- JS section end -->
</head>
<body>
</body>
</html>
添加应用启动代码：
$(document).ready(function() {
function initialize() {
//router = new AppRouter();
//Backbone.history.start();
Handlebars.partials = Handlebars.templates; //for using one template inside the other.
HandlebarsHelper.registerCustomHelpers();
$.klplot.init();
$.ajaxSetup({
timeout: 40000 //15 seconds default time out.
});
var masterView = new MasterView();
}
initialize();
});
在masterview.js中：
initialize: function() {
var contentbox = Handlebars.templates.contentbox();
$("body").append(contentbox);
this.$el = $(this.id);
this.currentView = new LoginView({
containerId:this.tagIds.contentBox,
viewId:this.viewIds.login});
this.backButtonStack.push("#");
this.bindEvents();
}