我正在使用backbone.js 和phonegap 为android、IOS 和Windows 创建一个混合应用程序。下面是 HTML、router.js 和 loginView.js 代码。
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="css/jquery-ui-1.10.3.min.css"/>
<script type="text/javascript" src="js/libs/jquery/jquery-1.10.1.min.js" ></script>
<script type="text/javascript" data-main="js/main" src="js/libs/require/require.js"> </script>
<script charset="utf-8" src="cordova.js"><\/script>
</head>
<body>
<div class="loading">
<span>Loading Data</span>
</div>
</div>
</body>
</html>
router code:
define(['jquery', 'underscore', 'backbone', 'jqueryui'],
function($, _, Backbone, jqueryui) {
var myviews = [];
var mainRouter = Backbone.Router.extend({
routes : {
"home" : "homepage",
"*path" : "defaultRoute"
}
});
var initialize = function() {
var routrObj = new mainRouter;
routrObj.on('route:homepage', function(actions) {
$(myviews).each(function(ind, val) {
val.undelegateEvents();
val.$el.removeData().unbind();
val.$el.remove();
myviews.pop(val);
});
require(['view/landing'], function(landing) {
var landing_new = new landing();
landing_new.render();
myviews.push(landing_new);
});
});
routrObj.on('route:defaultRoute', function(actions) {
$(myviews).each(function(ind, val) {
val.undelegateEvents();
val.$el.removeData().unbind();
val.$el.remove();
myviews.pop(val);
});
require(['view/loginView'], function(loginview) {
var login = new loginview();
login.render();
myviews.push(login);
});
});
Backbone.history.start();
};
return {
initialize : initialize
};
});
Login View code :
define(['jquery', 'backbone', 'underscore', 'common', 'text!template/login.html'], function($, Backbone, _, common, loginPage) {
var loginResp, hash, self, XDeviceType = "";
var login_view = Backbone.View.extend({
id : 'loginpage',
/*Initializing the login view */
initialize : function() {
sessionStorage.clear();
hash = CryptoJS.MD5("Skandia").toString();
},
/**
* To load the login page
* @param {void}
*/
render : function() {
self = this;
var compiledTemplate = _.template(loginPage);
this.$el.append(compiledTemplate);
var bodyDiv = $('body');
this.$el.appendTo(bodyDiv);
}
});
return login_view;
});
当用户尝试注销时，index.html 会重新加载(使用 window.location.href = 'index.html')。在 Windows Mobile(windows 8) 中，重新加载页面时，body 变得未定义。因此会显示空白屏幕。此问题仅发生在 Windows 中，对于 Android/IOS/其他浏览器，页面显示完美。 Bckbone.js/jquery 已完美加载。无法找出问题所在。
非常感谢任何帮助或建议。
提前致谢!
最佳答案
使用 Backbone.history.navigate 方法
注销时点击
localStorage.clear();
sessionStorage.clear();
Backbone.history.navigate('/home', true);
在window.location.href中所有文件都重新下载
关于javascript - Backbone .js : body become undefined when loaded for the 2nd time (windows mobile)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24992295/