我正在创建一个简单的按钮来隐藏我的应用程序中的侧边栏导航。
我在这里有这个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
替换侧边栏主切换,但它也没有触发它。关于为什么这不会按预期工作的任何想法?
您是否在运行代码之前确保DOM已准备就绪,例如:
$(document).ready(function(){
$('#sidebar-toggle').on('click', function() {
$('.sidebar-main').toggle();
});
});
尝试将click事件放在$(document).ready()函数中。它将确保DOM已准备好执行JavaScript代码。
请点击此链接获取帮助:https://learn.jquery.com/using-jquery-core/document-ready/