javascript – 如何让Turbolinks停止干扰我的JS?
作者:互联网
所以我有一个按下按钮执行一些JS.但正在发生的事情是它首次加载它所使用的页面,但是一旦我转到另一个页面并按下该新页面上的按钮,它就不起作用了.
根据Turbolinks文档,这是正常的 – 所以我必须进行修改.
这个部分涵盖在这个RailsCast – http://railscasts.com/episodes/390-turbolinks?view=asciicast中 – 但Ryan给出的解决方案是在CoffeeScript中,我使用普通的旧香草JS.
这是我的posts.js文件:
$(function(){
var toggleSidebar = $("#togglesidebar");
var primary = $("#primary");
var secondary = $("#secondary");
toggleSidebar.on("click", function(){
if(primary.hasClass("col-sm-9")){
primary.removeClass("col-sm-9");
primary.addClass("col-sm-12");
secondary.css('display', 'none');
}
else {
primary.removeClass("col-sm-12");
primary.addClass("col-sm-9");
secondary.css('display', 'inline-block');
}
});
});
$(document).on('page:load');
Per RailsCasts,这是他们的建议:
ready = ->
$('.edit_task input[type=checkbox]').click ->
$(this).parent('form').submit()
$(document).ready(ready)
$(document).on('page:load', ready)
当我在posts.js的底部尝试这个时:
$(document).ready();
$(document).on('page:load', ready());
我收到此错误:
Uncaught ReferenceError: ready is not defined
关于如何得到这个的想法?我很确定它很简单,但我的JS经验很少,而且使用CoffeeScript的经验更少.
解决方法:
如果您使用的是JS而不是CoffeeScript,那么为什么准备好了= – >在你的JS文件中?
试试这个.
var ready;
ready = function() {
$('.edit_task input[type=checkbox]').click(function() {
$(this).parent('form').submit();
});
};
$(document).ready(ready);
$(document).on('page:load', ready);
在你的情况下:
var ready;
ready = function() {
var toggleSidebar = $("#togglesidebar");
var primary = $("#primary");
var secondary = $("#secondary");
toggleSidebar.on("click", function(){
if(primary.hasClass("col-sm-9")){
primary.removeClass("col-sm-9");
primary.addClass("col-sm-12");
secondary.css('display', 'none');
}
else {
primary.removeClass("col-sm-12");
primary.addClass("col-sm-9");
secondary.css('display', 'inline-block');
}
});
};
$(document).ready(ready);
$(document).on('page:load', ready);
标签:turbolinks,javascript,jquery,ruby-on-rails,coffeescript 来源: https://codeday.me/bug/20190830/1768790.html