使用jquery mobile,backbone和require.js构建移动Web应用程序,使其模块化。 我有一个html页面,有这个;
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>DoIt</title>
<link href="jqm/jquery.mobile-1.2.0.css" rel="stylesheet">
<script charset="utf-8" src="jqm/jquery-1.7.2.min.js"></script>
<script charset="utf-8" src="jqm/jquery.mobile-1.2.0.min.js"></script>
<script charset="utf-8" src="libs/require.js" data-main="app"></script>
</head>
我的app.js文件看起来像这样
//Require.js configuration
require.config({
paths: {
'underscore': 'libs/underscore-min',
'backbone': 'libs/backbone-min',
'text': 'libs/text'
},
shim: {
'backbone': {
deps: ['underscore'],
exports: 'Backbone'
}
}
});
require(['backbone', 'views/main'], function (Backbone, AppView) {
'use strict';
var view = new AppView();
$(document).bind('pagecreate', function () {
view.render();
});
});
这是视图的模板
<script type="text/html" id="app-view-tmpl">
<div id="task-creator">
<input type="text" id="task" placeholder="Enter a task">
<button data-role="button" data-theme="b">
Create task
</button>
</div>
</script>
我使用'pagecreate'事件来触发视图的渲染。 视图不会呈现,但会记录我在视图初始化时记录到控制台的其他详细信息。 我做错了什么?
答案 0 :(得分:0)
我对backbone.js知之甚少,但是在构建它们之后你是否“刷新”你的小部件?
http://jquerymobile.com/demos/1.2.0/docs/lists/lists-methods.html
$("#myListView").listview("refresh");
或
$("#myButton").button("refresh");
这应该是pagecreate
逻辑的一部分。获取模板的其他详细信息会很有帮助。