backbone相关的知识

Backbone.js为复杂WEB应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和自定义事件；集合附有可枚举函数的丰富API；视图可以声明事件处理函数，并通过RESRful JSON接口连接到应用程序。他的MVC模式和Java的MVC模式比较像，这一个比较好的学习框架。

这是通过URL获取数据，再展示到前台，在通过用户文本输入的内容，再和数据内的id匹配，进行查询显示到另一个页面，并将读取的数据升序降序。

       var GistsView = Backbone.View.extend({
           el : 'tbody',
           collection : gists,
           initialize : function() {
               this.listenTo(this.collection, 'reset', this.render);
           },
           render : function() {
               var html = '';
               _.forEach(this.collection.models, function(model) {
                   var tr = new GistRow();
                   html += tr.render(model).el.outerHTML;
               });
               this.el.innerHTML = html;
               return this;
               }
           });
       var flag = true;
       var gistsView = new GistsView();
               gists.fetch({
               reset : true
（标记B） });

(function($) {//这DMO标签属性的点击事件
           var SearchView = Backbone.View.extend({
                   el : "body",
                   events : {
                       'click #lookup2' : 'doSearch',
                       'click #sort': 'Sort',
                       'click #id1' :'lin',
           },
               doSearch : function() {
                   var obj =document.getElementById('lookup1').value;
                   if(gists.get(obj)){
                       var c=gists.get(obj).attributes;
                       document.getElementById("lin").value=("id:"+c.id+"\n"
                                                               +"firstName:"+c.firstName+"\n"
                                                               +"lastName:"+c.lastName+"\n"
                                                               +"email:"+c.email+"\n"
                                                               +"phone:"+c.phone+"\n"
                                                               +"adress:"+c.adress+"\n"
                                                               +"description:"+c.description+"\n"
                                                           );
                   }else{
                       alert("No results were found")
                   };
           },
               lin : function() {
                   alert("aa")
           },
               Sort : function() {
                      var oTabNode = document.getElementById("table");
                   var collTrNodes = oTabNode.rows;
                   var trArr = [];
                   for(var x=0; x<collTrNodes.length; x++){
                   trArr[x-1] = collTrNodes[x];
                   }
                   mySort(trArr)
                   if (flag) {
                   for (var x = 0; x < trArr.length; x++) {
                   trArr[x].parentNode.appendChild(trArr[x]);
                   }
                   flag = false;
                   }else{
                   for (var x = trArr.length-1; x >=0; x--) {
                   trArr[x].parentNode.appendChild(trArr[x]);
                   }
                   flag = true;
                   }
                   function mySort(arr){

           for(var x=0; x<arr.length-1; x++){
           for(var y=x+1; y<arr.length; y++){
           if(parseInt(arr[x].cells[0].innerHTML)>parseInt(arr[y].cells[0].innerHTML)){
           var temp = arr[x];
           arr[x] = arr[y];
           arr[y] = temp;
           }
           }
           }
           }
               }
           });
           var searchView = new SearchView();
       })(jQuery);
   </script>

backbone相关的知识

猜你喜欢