繁体   English   中英

jQuery在Heroku上有效,但在Rails localhost上无效

[英]jQuery works on Heroku, but not on Rails localhost

我写了一些jQuery,以定位左侧导航栏中的列表项(li)。 当我将更改推送到Heroku时,jQuery可用,但是我编写的jQuery在localhost上不起作用。 我想要的效果是,当用户将鼠标悬停在导航栏中的链接上时,这些链接将移至右侧的2 em。 我不知道为什么jQuery可以在托管站点而不是本地主机上工作。 我觉得它可能与application.js文件有关。 任何帮助将不胜感激,并在此先感谢!!!

// javascript assets
// = require jquery
// = require jquery_ujs
// = require turbolinks
// = require welcome.js
// = require_tree .

// the html
<div class="list-items">
      <ul>
        <li class="links"><%= link_to "Portfolio", portfolio_url %></li>
        <li class="links"><%= link_to "Tutorials", tutorials_url %></li>
        <li class="links"><%= link_to "Blog", blog_url %></li>
        <li class="links"><%= link_to "About Me", aboutme_url %></li>
      </ul>
</div>

// css for list items
.list-items {
    font-size: 1.5em;
    line-height: 2em;
    margin-left: -.20em;
}


// JS for hovering over the link
$(document).ready(function() {
  console.log("You are in the console right now!!");

  $(".links").on("mouseenter", function() {
    $(this).css("margin-left", "2em");
  });

  $(".links").on("mouseleave", function() {
    $(this).css("margin-left", "-0.05em");
  });
});

这里有一件事想到...

TurboLinks不适用于

$(document).ready(function() {

因为在浏览时,Turbolinks不会重新加载页面。 仅仅是因为Turbolinks加载页面的方式,您可能无法在本地计算机上看到它正常工作。 在生产中,也许您浏览的方式有所不同,并且页面实际上触发了此事件。

有关此方面的一些详细信息,请参见Rails 4:如何将$(document).ready()与Turbo链接一起使用。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM