vis*_*shB 78 jquery twitter-bootstrap ruby-on-rails-4
我创建了一个Rails 4应用程序,并为图像弹出效果添加了fancybox库.它工作正常,但只有在页面刷新时.如果用户不刷新页面,则jquery根本不起作用.我尝试用小jquery方法测试它,但所有工作只在页面刷新后才能工作.我也在使用twitter bootstrap.
我的assets/application.js文件:
//= require jquery
//= require jquery_ujs
//= require fancybox
//= require twitter/bootstrap
//= require turbolinks
//= require_tree .
$(document).ready(function() {
$(".fancybox").fancybox();
$("#hand").click(function(){
if($("#check6").is(':visible'))
{
$("#check6").hide();
}
else
{
$("#check6").show();
}
});
});
Run Code Online (Sandbox Code Playgroud)
Ian*_*Ian 180
好的,我认为我理解你的问题足以提供答案.关于使用turbolinks的事情是,大多数绑定到文档就绪事件的插件和库都停止工作,因为turbolink会阻止浏览器重新加载页面.有一些技巧可以解决这些问题,但最简单的解决方法是使用jquery.turbolinks.
要使用它,只需将其添加到您的Gemfile:
gem 'jquery-turbolinks'
Run Code Online (Sandbox Code Playgroud)
这到你的assets/javascripts/application.js文件:
//= require jquery.turbolinks
Run Code Online (Sandbox Code Playgroud)
你应该好好去.
仅供参考:您不需要使用turbolinks,但它很有用,它可以避免整页刷新,从而加快请求速度.Turbolinks通过AJAX获取您单击的链接的内容并将其呈现在同一页面上,从而消除了重新加载资源(JS和CSS)的开销.尝试使您的页面使用它.使用前一段中的库我没有真正的问题.您在页面上拥有的CSS和JS越多,使用turbolinks所获得的改进就越大.
Cod*_*rus 17
伊恩得到了一个很好的答案,这个是一个附加的类型(在写作时我不会让任何人评论.)
来自https://github.com/rails/turbolinks/#jqueryturbolinks:
Add the gem [gem 'jquery-turbolinks'] to your project, then add the following line to your JavaScript manifest file, after jquery.js but before turbolinks.js:
//= require jquery.turbolinks
Run Code Online (Sandbox Code Playgroud)
在我没有require jquery.turbolinks在列表中的正确位置添加之前,所以它有点挑剔.然后我添加了一种新的方式,我希望它更好.
在我遵循CodeWalrus和Ian的答案之前,我无法让事情奏效,但对我来说还有更多.如jquery.turbolinks自述文件所述,订单必须非常具体.
//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//
// ... your other scripts here ...
//
//= require turbolinks
Run Code Online (Sandbox Code Playgroud)
此外,如此处所述,如果您已将应用程序javascript链接放在页脚中以达到速度优化的原因,就像我一样,您需要将其移动到<head>标记中,以便在<body>标记中的内容之前加载它.
| 归档时间: |
|
| 查看次数: |
28862 次 |
| 最近记录: |