javascript - jquery点击事件不触发

Question

我正在重建我的网站，并希望从头开始做所有事情(没有 Bootstrap 、基础等)。现在我正在制作导航栏，我试图让它在点击时切换滑入和滑出。出于某种原因，点击事件不起作用，我不确定我做错了什么。我在codepen中做了一个粗略的例子here

HTML

<script src="jquery-3.4.1.min.js"></script>
<div class="box"></div>

CSS

.box {
  transform: translateX(0);
  width: 100px;
  height: 100px;
  background-color: red;
  transition: transform 250ms;
}
.slide {
  transform: translateX(250px);
}

JS

$(function() {
  $('.box').on('click', function(slideToggle) {
    $(this).toggleClass('slide');
  });
});

Answer 1

给你codepen的例子:

转到设置 -> 添加库 -> 搜索 jquery 并选择。

如果这与您的真实代码相同:

打开控制台 -> 检查 $ 是否未定义或 $ 不是 jquery？

如果 $ 没有定义，添加一个有效的 jquery cdn url。

如果 $ 不是 jquery，尝试查找冲突的库。