【问题标题】：How to trigger the coffeescript on infinite-scroll loaded page如何在无限滚动加载页面上触发咖啡脚本
【发布时间】：2017-10-23 07:06:28
【问题描述】：

我正在处理产品列表页面，更多产品加载了无限滚动。问题是加载新页面时，加载页面上的“产品缩略图”上的点击事件将不会执行。通过单击产品的缩略图，图像必须交换。我这里使用的 Carousel 是 jcarousel。

提前致谢

无限卷轴：

$(document).ready ->
 $("#home-products").infinitescroll
 navSelector: "nav.pagination" 
 nextSelector: "nav.pagination a[rel=next]" 
 itemSelector: "#home-products #products"

下面是在新加载的页面中执行的onclick函数

$('.product .v-color').on 'click', (e)->
e.preventDefault()
$this = $(@)
$product = $this.closest('.product')
$product.find('.v-color').removeClass('active')
number = $this.data('carousel-number')
$product.find('.carousel').carousel(number)
$this.addClass('active')
changePrice($product, $this.data('price'), $this.data('soldout'), 
$this.data('backorderable'))

【问题讨论】：

标签： javascript jquery ruby-on-rails coffeescript

【解决方案1】：

通过更改 onclick 功能解决了这个问题，如下所示：

$(document).on 'click', '.product .v-color', (e)->

【讨论】：

【解决方案2】：

我相信您的问题与 turbolinks 有关，turbolinks 不会触发 $(document).ready 事件，因为如果页面是从浏览器缓存的，则没有实际的页面重新加载。您需要使用的事件是

document.addEventListener("turbolinks:load", function() {
   // you js code
})

如果您想查看信息，这是turbolinks 5 documentation。我只是在做假设，无法确定您的实际问题是什么，但问题是由于您的event 在页面重新加载后没有被触发，所以这是有道理的

【讨论】：