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代码。

请点击此链接获取帮助： Function.prototype.bind()