jQuery没有在应用程序中触发但在控制台中工作

Question

我正在创建一个简单的按钮来隐藏我的应用程序中的侧边栏导航。

我在这里有这个HTML。

<h3>
  <a href="#" id="sidebar-toggle"><i class="material-icons">face</i></a>
  <span class="text-semibold">Dashboard
</h3>

在我的application.js

$('#sidebar-toggle').on('click', function() {
  $('.sidebar-main').toggle();
});

我在我的应用程序中安装了jQuery gem。

我将此代码添加到Chrome中的控制台，它运行正常。但是，如果我单击没有控制台中的代码的按钮它不起作用。

我尝试用console.log替换侧边栏主切换，但它也没有触发它。关于为什么这不会按预期工作的任何想法？

Answer 1

您是否在运行代码之前确保DOM已准备就绪，例如：

$(document).ready(function(){
  $('#sidebar-toggle').on('click', function() {
    $('.sidebar-main').toggle();
  });
});

Answer 2

尝试将click事件放在$（document）.ready（）函数中。它将确保DOM已准备好执行JavaScript代码。