Phonegap-Android的backbone-min.js之集合

最新推荐文章于 2020-06-13 17:49:43 发布

体温点蜡烛

最新推荐文章于 2020-06-13 17:49:43 发布

阅读量231

点赞数

分类专栏：手机开发

本文链接：https://blog.csdn.net/lc_880627/article/details/41282531

版权

手机开发专栏收录该内容

7 篇文章 0 订阅

订阅专栏

Model集合，Collection，用法类似java中的ArrayList。

<!DOCTYPE html> 
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<title>index.html</title> 
	<link rel="stylesheet" href="../jquery.mobile-1.0.1.min.css" />
	<script type="text/javascript" charset="utf-8" src="../jquery.js"></script>
	<script type="text/javascript" charset="utf-8" src="../jquery.mobile-1.0.1.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="../cordova-2.0.0.js" ></script>
	<script type="text/javascript" charset="utf-8" src="../underscore-min.js"></script>
    <script type="text/javascript" charset="utf-8" src="../backbone-min.js"></script>
	<script type="text/javascript" charset="utf-8">	
	//1、为dom注册事件，设备加载完成后回调createObject()方法
	 $(document).ready(function(){  
        document.addEventListener("deviceready", createObject, false);   
    });
    //2、定义一个模型
	   var TodoItem=Backbone.Model.extend({
        	initialize: function(){
        		
        	}
        });  
    //3、定义一个Collection，是一个Model的集合，可以理解为java中的ArrayList
        var TodoList=Backbone.Collection.extend({
        //Collection中允许的Model类
        	model:TodoItem
        });
        var todoList=new TodoList();
   //4、创建2个TodoItem类的对象，放入到Collection中
	function createObject(){
		var todoItem1=new TodoItem({  
    		item:"todoItemTest1"
        });  
		var todoItem2=new TodoItem({  
    		item:"todoItemTest2"
        }); 
        todoList.add(todoItem1);
        todoList.add(todoItem2);
	}
   //5、点击按钮，获取Collection的长度
	function onClickFuc(){
		alert(todoList.length);
	}
	</script>	
</head> 
<body>
<!-- begin first page -->
<div id="page1" data-role="page" >
<header data-role="header"><h1>Hello World</h1></header>
<div data-role="content" class="content">
<div id="textdiv">HelloWorld</div>
<button type="button" οnclick="onClickFuc()">Click Me!</button>
</ul>
</div>
<footer data-role="footer"><h1>Footer</h1></footer>
</div>
<!-- end first page -->
</body>
</html>