使用小胡子模板和jQuery的砖石

Question

我实现这个教程严重影响了无尽的滚动效果实现无尽滚动时DOM异常8错误：

http://railscasts.com/episodes/295-sharing-mustache-templates?view=asciicast

但是，我这样做略有不同，因为我是在前端使用Jquery Masonry（http://masonry.desandro.com/demos/adding-items.html）。

无论如何，当我实现这个如下：

jQuery -> 
window.endlessScroll =() -> 
    if $('#products_page').length 
     new ProductPager 

class ProductPager 
constructor: -> 
    $(window).scroll(@check) 

check: => 
    if @nearBottom() 
     $(window).unbind('scroll', @check) 
     $.getJSON($('#products_page').data('json-url'), @render) 

nearBottom: => 
    $(window).scrollTop() > $(document).height() - $(window).height() - 150 

render: (products) => 
    boxes= [] 
    $container = $('#products_page') 
    for product in products 
     boxes.push Mustache.render $('#mustache_product').html(), product 
    $container.append(boxes).masonry "appended", boxes 
    $(window).scroll(@check) 

我得到以下错误（铬）：

未捕获的错误：NOT_FOUND_ERR：DOM异常8

我认为问题出在这里：

boxes.push Mustache.render $('#mustache_product').html(), product 

因为这种包装在“QUOT每个模板输出ES”，即

["<div>stuff</div>","<div>more stuff</div>"] 

而不是：

[<div>stuff</div>,<div>more stuff</div>] 

，但我有一些关于我在做什么错了....人照顾，帮助心理障碍的？

Answer 1

我得到这个由下面砌体网站上的例子，以更紧密地合作，这就造成了这一点：

. 
. 
. 
boxMaker.makeBoxes = -> 
    boxes = [] 
    for product in products 
    box = document.createElement("div") 
    template = Mustache.render $('#mustache_product').html(), product 
    box.className = "box" 
    box.innerHTML = template 
    boxes.push box 
    boxes 
$boxes = $(boxMaker.makeBoxes())