Ошибка DOM Exception 8 при реализации бесконечной прокрутки с использованием шаблонов усов и кладки jquery - PullRequest
Новая
       23

Ошибка DOM Exception 8 при реализации бесконечной прокрутки с использованием шаблонов усов и кладки jquery

0 голосов
/ 15 января 2012

Я реализую эффект бесконечной прокрутки, находящийся под сильным влиянием этого урока:

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)

Я получаю следующую ошибку (Chrome):

Uncaught Ошибка: NOT_FOUND_ERR: DOM Exception8

Я думаю, что проблема заключается здесь: 

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

, потому что это оборачивает каждый вывод шаблона в "кавычки", то есть 

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

, а не: 

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

Но у меня возникла небольшая психическая блокада из-за того, что я делаю неправильно ... кто-нибудь хочет помочь?

1 Ответ

0 голосов
/ 16 января 2012

Я получил это для работы, следуя примеру на сайте масонства более внимательно, что привело к следующему: 

.
.
.
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())
...