页面加载上的Javascript：在控制台中工作，但不加载_Javascript_Jquery_Ruby On Rails

页面加载上的Javascript：在控制台中工作，但不加载

javascript jquery ruby-on-rails

页面加载上的Javascript：在控制台中工作，但不加载,javascript,jquery,ruby-on-rails,Javascript,Jquery,Ruby On Rails,我想在加载以下内容时在我的主页上运行此javascript： $(".mm-page").css({"position":"inherit"}); 我在my home.html.erb的底部添加了以下内容： <% content_for(:after_js) do %> <script type="text/javascript"> console.log("before"); $(".mm-page").css({"position":"inh

我想在加载以下内容时在我的主页上运行此javascript：

  $(".mm-page").css({"position":"inherit"});

我在my home.html.erb的底部添加了以下内容：

<% content_for(:after_js) do %>
  <script type="text/javascript">
    console.log("before");
    $(".mm-page").css({"position":"inherit"});
    console.log("after");
  </script>
<% end %>


控制台日志（“之前”）；
$（“.mm page”）.css（{“position”：“inherit”}）；
控制台日志（“之后”）；

这两个console.log都出现在控制台中，但jquery没有任何效果。如果我在控制台中手动运行jquery行，它将按预期工作

我应该如何继续修复此问题？

既然要使其在加载时在页面上工作，则应将其包装在就绪处理程序中。

ready（）

方法指定就绪事件发生时发生的情况

可以使用两种语法：

$(document).ready(function(){
     $(".mm-page").css({"position":"inherit"});
});

或

$(function() {
    $(".mm-page").css({"position":"inherit"});
});

还要确保元素

.mm页面

与jQuery选择器一起使用时存在。

要确保它所操作的所有DOM元素都存在，请在关闭

标记之前，将

脚本

标记放在HTML的最底部。上面的HTML定义的所有元素都可以使用。这还可以确保浏览器可以在下载您引用的任何外部脚本文件之前向用户显示页面。例如：

<!doctype html>
<html>
<!-- ...your page here... -->
<script src="jquery.js"></script>
<script>
  console.log("before");
  $(".mm-page").css({"position":"inherit"});
  console.log("after");
</script>
</body>
</html>


控制台日志（“之前”）；
$（“.mm page”）.css（{“position”：“inherit”}）；
控制台日志（“之后”）；

您需要将其转换为您正在使用的任何渲染引擎，但您明白了。最终进入浏览器的结果应该是这样的

或者，您也可以使用jQuery的

ready

回调，但是如果脚本标记位于正确的位置，就没有必要了

旁注：默认的

类型是JavaScript，不需要在script
标记上指定它
console.log appear in the console 

因为您的DOM
已经完成加载，现在可以使用了
这就是为什么您会得到jQuery效果
在您当前的脚本中，它不会等待完成DOM
加载并直接对其进行操作，这是不可用的，因为它尚未完成加载
她把它写成剧本
$( document ).ready(function() {
  // Handler for .ready() called.
});

或：
在dom就绪处理程序中添加脚本，然后重试
$(function() {
  // Handler for .ready() called.
});