gpt4 book ai didi

ruby-on-rails-4 - Rails 4 + Turbolinks + JQuery Turbolinks + Coffeescript : Events being fired multiple times

转载 作者:行者123 更新时间:2023-12-03 00:02:19 27 4
gpt4 key购买 nike

首先,所有受限制的 javascript 都运行得很好。

但是,从我导航到另一个页面的那一刻起,任何事件都会被多次触发。如果我刷新页面,一切都会恢复正常。

在 jquery.turbolink 文档中,there is an alert关于在 $(function()) block 内绑定(bind)文档事件。然而,coffescript 似乎默认是这样工作的。那么,我该怎么办?

这是我的环境:

gem 文件:

gem 'turbolinks'
gem 'jquery-turbolinks'

application.js

//= require jquery
//= require jquery.turbolinks
//..app js
//= require turbolinks

application.html.erb

<html>
<head>
<meta charset="utf-8">
<title><%= t 'brand' %> </title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= yield :head %>
<%= csrf_meta_tags %>
<meta name="description" content="<%= yield :page_description %>">
<meta name="keywords" content="<%= yield :page_keywords %>">
</head>

controller.js.coffee

$(document).ready ->    
$(document).on 'click', '.addition .label i', (e) ->
console.log ".addition .label i 'click' fired!"

问题是,显然由 CoffeeScript 生成的 javascript 文件默认位于一个 block 内。检查一下:

controller.js(由coffescript生成)

function() {
$(document).ready(function() {
$(document).on('click', '.addition .label i', function(e) {
console.log(".addition .label i 'click' fired!");
});
...

那么,我应该怎么做才能正确使用coffeescript + JQuery Turbolinks?我应该进行不同的配置吗?

干杯。

最佳答案

问题出在controller.js.coffee中。

你写的是:

$(document).ready ->    
$(document).on 'click', '.addition .label i', (e) ->
console.log ".addition .label i 'click' fired!"

但是由于您使用的是 jQuery Turbolinks,因此需要将事件处理程序移至 $(document).ready 函数外部:

$(document).ready ->
# Other code can go here, but not binding event handlers
$(document).on 'click', '.addition .label i', (e) ->
console.log ".addition .label i 'click' fired!"

看看jQuery Turbolinks README 。它提到了这个问题和解决方案。 (在自述文件中搜索“事件触发两次或多次。”)

关于ruby-on-rails-4 - Rails 4 + Turbolinks + JQuery Turbolinks + Coffeescript : Events being fired multiple times,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23535488/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com