BackBone：從jQuery元素獲取子視圖

Question

我呈現一個列表發佈到模板後，從窗口滾動事件中選擇它，我需要在這篇文章中獲取模型和事件。 我想獲取視圖窗口滾動事件時使用模型或事件從路線使用？有辦法做到這一點？

副視點：

Post = Backbone.View.extend({ 
    tagName: "div", 
    className: "post", 

    initialize: function() { 
     this.post = this.model; 
     this.render(); 
    }, 

    render: function() { 
     $(this.el).html(this.template(this.post)); 
     return this; 
    } 
}); 

觀點：

ListPost = Backbone.View.extend({ 
    tagName: "div", 
    className: "listpost", 

    initialize: function(models, options){ 
     this.listpost = options.listpost; 
     this.render(); 
    }, 
    render: function() { 

    _.each(this.listpost, function (post) { 
     $(this.el).append(new Post({model: post}).el); 
    }, this); 

    return this; 
}}); 

路線：

var AppRouter = Backbone.Router.extend({ 

initialize: function() { 
    $('body').html(new ListPost([], {listpost: posts}).el); 
    window.onscroll = this.scroll; 
}, 

scroll : function() { 
    var element = $('.post'); 
    var find_out = false; 
    for(var i = 0; i< element.length; i++) { 
     if(find_out) break; 
     var post = element[i]; 
     if(post.getBoundingClientRect) { 
     var rect = post.getBoundingClientRect(); 
     x = rect.bottom; 
     y = rect.top; 
     if(x > 0) { 
      if(x > 480/3) { 
       //result is post 
       // how i can select this post to sub view Post 
       find_out = true; 
      } 
     } 
     } 
    } 
}}); 

Answer 1

移動scroll功能的ListPost所以你可以有意見陣列在你的範圍。

例子：

ListPost = Backbone.View.extend({ 
    tagName: "div", 
    className: "listpost", 

    initialize: function(models, options){ 
     this.listpost = options.listpost; 

     // Add scroll event here ($.proxy makes sure the event can see this.element). 
     $(document).scrool($.proxy(this.scroll, this)); 

     this.render(); 

     // Create an array to hold a reference to all Post views. 
     this.element = []; 
    }, 

    render: function() { 
     _.each(this.listpost, function (post) { 
      // Create the post views and add them to the array. 
      var postView = new Post({model: post}); 
      this.element.push(postView); 
      $(this.el).append(postView.el); 
     }, this); 

     return this; 
    }, 

    scroll: function() { 
     var find_out = false; 
     // Make sure you use this with element. 
     for(var i = 0; i< this.element.length; i++) { 
      if(find_out) break; 

      // Post is now a Backbone view. 
      var post = this.element[i]; 

      // Make sure you use post.el to access the views DOM element. 
      if(post.el.getBoundingClientRect) { 
      var rect = post.el.getBoundingClientRect(); 
      x = rect.bottom; 
      y = rect.top; 
      if(x > 0) { 
       if(x > 480/3) { 
        //result is post 
        // how i can select this post to sub view Post 
        find_out = true; 

        // Do what you want with the backbone view. 
        post.render(); 
        console.log(post.model); 
       } 
      } 
      } 
     } 
    } 
});