Tag: turbolinks

如何使这个JS Turbolinks友好?

这是我的main.js文件: jQuery(function($) { $(‘LI.tree-item-name’).has(‘ul’).click(function() { if ($(this).hasClass(‘opened’)) { $(this).find(‘UL’).slideUp(); $(this).removeClass(‘opened’); } else { $(this).find(‘UL’).slideDown(); $(this).addClass(‘opened’); } return false; }); $(‘LI.tree-item-name li’).click(function(e) { e.stopPropagation(); }) }); jQuery(window).load(function(){ jQuery(‘#video’).removeClass(‘loading’); jQuery(‘#video .box’).animate({‘opacity’ : ‘1’}); var $container = jQuery(‘#video’); $container.masonry({ columnWidth: 299, itemSelector: ‘.box’ }); jQuery(‘.popupbox’).click(function(){ jQuery(‘.popup:visible’).fadeOut(); var id = ‘#’+jQuery(this).data(‘popup’); jQuery(‘#overlay’).fadeIn(); jQuery(id).css(‘top’, jQuery(window).height()/2 – jQuery(id).height()/2).fadeIn(); return false; }); […]

$(文件).on’就绪页面:加载’ – 无法正确使用ie10

我正在开发rails。 对于jquery我使用coffeescript。 turbolinks很活跃。 我有一个问题,它让我感到紧张。 当我想启动我的function(这里称为脚本)时,我使用以下代码: $(document).on ‘ready page:load’, => scripts() 我的脚本(div滑块)在加载页面时运行,在所有浏览器中都没有任何问题。 无论如何,当我点击另一个页面然后回到开始时,javascript没有加载。 这个问题实际上只在ie10中。 我已经尝试了以下内容: $(document).on ‘ready page:change’, => scripts() ..但然后div滑块失去控制。 它跳得非理性。 😉 我能做什么? 有任何想法吗? 谢谢! ST

jQuery自动完成function在Rails 4中不起作用

我正在尝试在我的Rails 4.0应用程序中集成jQuery UI Autocomplete,就像在这个Railscast: 102-AutoCompleteAssociationRevised中描述的那样。 不幸的是,自动完成function不起作用。 虽然呈现的HTML看起来很好,但我没有得到任何建议: 我也停用了Turbolinks,但没有改变…… 在我的Gemfile中,我包含了gem’jquery gem ‘jquery-ui-rails’ ,我的application.js看起来像这样: //= require jquery //= require jquery.ui.all //= require jquery_ujs //= require bootstrap //= require turbolinks //= require jquery-fileupload/basic //= require jquery-fileupload/vendor/tmpl //= require_tree . 这是我正在使用的forms, edit.html.erb : autocomplete.js.coffee: autocomplete = -> $(‘#plan_part_name’).autocomplete source: $(‘#plan_part_name’).data(‘autocomplete-source’) $(document).ready(autocomplete) $(document).on(‘page:load’, autocomplete)

在Turbolinks存在的情况下导航回来时,如何防止jQuery DataTable上的重复包装?

我在一个新的Rails 4.2项目中使用jQuery DataTables。 我有大量的结果需要在组,项目和状态上进行过滤。 选择组通过应用程序的往返过滤项目选择,项目选择以相同的方式过滤表格。 我将组和项目保存在会话变量中,这样当用户更改页面时,然后单击主链接返回,它将记住他们的选择,并将它们返回到原来的位置。 这一切都像我打算一样。 问题是使用浏览器的后退按钮从不同的页面返回到表将导致DataTable周围的重复包装器(带有搜索框,项目数下拉列表和分页链接)。 我添加了jquery-turbolinks gem。 我试过摆弄事件听众 ,但我无法使这些想法发挥作用。 我已经尝试使用data-turbolinks=false来使用Turbolinks免除页面主体。 我已经尝试将我的脚本密钥更改为$(document).ready() ,如page:load 。 他们都没有阻止这一点。 我已经尝试将DataTable的所有脚本加载为Turbolinks,并在该特定页面中使用data-turbolinks-eval=false (使用content_for :head )。 我发现的唯一一件事就是阻止这个包装器重复发生就是简单地删除调用以完全包含来自资产的turbolinks JS。 如果我不知道比我更聪明的人认为它应该是应用程序的一部分,我已经做到了这一点。 我不知道该怎么办。 我正在寻找处理这个问题的优雅方式。

在每个turbolinks页面中使用jQuery的委托事件on():load

我在rails应用程序中有这个代码: $(document).ready( function() { myCustomFunction(“#link-selector”); } function myCustomFunction(linkCssSelector){ // some stuff… $(document).on(‘click’, linkCssSelector, function(){ // …some other stuff… }); } click事件处理已经委托给文档 ,但现在我必须将Turbolinks添加到我的应用程序中。 然后,我将采用ready()函数并执行以下操作(基于我的搜索): $(document).on(“ready page:load”, function() { myCustomFunction(“#link-selector”); } 但是一些引用告诉我不要在页面加载中添加绑定,因为它会在每次turbolinks加载某些东西时创建另一个绑定。 那是非常合理的。 但是,就我而言,我已经将click事件委托给myCustomFuntion document 。 问题是:每次页面加载时都可以on()函数on()运行此事件委托吗? Obs :问题也可以改写:在很多页面加载之后,这段代码长期会造成麻烦吗? Obs 2:我无法从myCustomFunction获取click事件处理,因为它取决于之前完成的计算。

Turbolinks消灭了jQuery Mobile类

当我使用Turbolinks在我的rails应用程序中加载页面时,DOM缺少jQuery Mobile通常应用的样式。 我的所有JavaScript文件都运行; 唯一的问题是我失去了JavaScript 实际工作所需的一些样式。 例如,使用Turbolinks,我的标题是: MY SITE 没有,它是: MY SITE 我已经确认我的JS文件正在与Turbolinks一起运行。 问题是预期的jQuery Mobile类不存在。 单击Turbolink时,我不确定如何确保应用这些类。 对于正确的方向或区域,我将不胜感激。 我试过用以下方式包装JavaScript: $(document).ready(function () { //functions }); 和: $(document).on(‘turbolinks:load’, function() { //functions }); 我把coffeescript包裹在同一个: ready = -> #coffee $(document).on(‘turbolinks:load’, ready) 两者似乎都适用于我正常的JS / coffeescript活动,所以这不是问题 – 它只是丢失的jQuery Mobile类。 我的application.js文件是: //= require jquery //= require jquery_ujs //= require jquery.mobile //= require js-routes //= […]

Turbolinks无法正常工作 – 而是两次加载页面

所以,在我的Rails 4应用程序中,我有Turbolinks gem。 //= require jquery.js //= require jquery.turbolinks //= require turbolinks 然而,似乎有些不对劲。 Turbolinks的重点是,您不必在开始时加载除了一次以外的所有jquery / css / asset管道吗? 嗯,这似乎没有发生,并且每次请求新页面时它都会继续加载所有jquery,而且甚至会使每个页面加载两次 。 如: Started GET “/” for ip at 2014-01-21 18:55:35 +0200 *Loads bunch of stuff here* Started GET “/” for ip at 2014-01-21 18:55:35 +0200 *Loads bunch of stuff here* Started GET “/assets/jquery.js” Started GET “/assetsjquery_ujs” […]

从页面导航到页面时,JavaScript不会执行

我正在构建我的第一个Ruby on Rails应用程序,我尝试创建一个动画导航栏。 我正在使用jQuery和turbolink。 这是我的application.js (在/app/assets/javascripts ) $(document).ready(function(){ $(“#nav”).hover(function(){ $(“#nav”).animate({left:’10px’}); }, function(){ $(“#nav”).animate({left:’-220px’}); }); }); 在application.html.erb (在app/views/layouts ),我有 true %> 和我的超级导航栏,现在看起来像这样(也在app / views / layouts下) 当我加载我的应用程序时,动画可以正常工作,但是当我导航到应用程序的其他页面时,动画将停止工作。 如果按F5 ,它会再次运行 所以如果我想使用我的导航栏,我必须刷新每一页。 你知道我该怎么做才能解决这个问题吗?

Rails中的JQuery在从另一个页面链接后失败,适用于页面加载

我在我的主页上有一个引用旋转器。 当我直接从浏览器加载页面(在浏览器中键入地址并按Enter键)它工作正常..但是,如果我点击链接到我的网站中的另一个页面,然后链接回到它停止工作。 更具体地说,引号开始重叠,几乎就好像该方法的两个实例正在运行一样。 我认为这可能是javascript如何加载的问题。 由于我在网站的另一个页面上有一个标签脚本,它会加载正常,但如果我链接并返回页面它不再有效… 在控制台中没有收到任何错误。 我在Ubuntu 12上运行Rails 4,Ruby 2.0.0,Foundation,并使用WebBrick进行测试。 Gemfile发布在下面: source ‘https://rubygems.org’ # Bundle edge Rails instead: gem ‘rails’, github: ‘rails/rails’ gem ‘rails’, ‘4.0.0’ # Use mysql as the database for Active Record gem ‘mysql2’ # Use SCSS for stylesheets gem ‘sass-rails’, ‘~> 4.0.0’ # Use Uglifier as compressor for JavaScript assets gem ‘uglifier’, […]

Rails 5 – turbolinks 5,一些JS没有在页面上加载渲染

我有一个Rails应用程序,我最近更新到5.0.0.RC1 。 大部分过渡进展顺利,但我在使用新的Turbolinks时遇到了一些麻烦。 在我的应用程序中我例如使用此gem: gem ‘chosen-rails’ 我的application.js文件如下所示: //= require jquery //= require jquery.turbolinks //= require jquery_ujs //= require best_in_place //= require tether //= require bootstrap //= require chosen-jquery //= require_tree . //= require turbo links 当我点击链接并呈现视图时,我chosen-query ( best_in_place也不起作用)在初始加载中不起作用,但是如果我对页面进行了硬刷新,则它可以正常工作。 下面是我得到的结果的图像: 以下是我希望它看起来的图像: 再次,如果我对页面进行了硬刷新,那么预期的外观会有效,但是在常规redirect_to …之后不会redirect_to … 我的下拉列表的代码如下所示: = select_tag :screen, options_from_collection_for_select(@screens, “id”, “name”), id: “screen-selection”, prompt: “Jump to […]