javascript - 当我点击按钮时，没有任何反应

Question

我有以下HTML，

$(document).ready(function() {
	$('#searchMovieBtn').click(function(e) {
		e.preventDefault();
		console.log('search');
	});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="searchMovieBtnBox">
    <button class="btn btn-primary" type="button" id="searchMovieBtn">Search</button>
</div>

当我点击按钮时，没有任何反应，似乎事件没有触发。

Answer 1

这是一个缓存问题。当您开发和测试 JQuery 代码时，旧代码仍保留在浏览器缓存中。浏览器对其进行缓存，以便在下次使用时更快地加载页面。为了解决这个问题，您有 3 个选择。

1. 删除您的浏览器历史记录
2. 按 Ctrl + F5 刷新浏览器(首选用于开发目的)
3. 通过添加版本告诉浏览器此 JQuery 代码已更改。当您在服务器上发布代码时使用它，因为您不能要求客户删除其浏览器历史记录或通过按 Ctrl + F5 加载您的页面

以下是向 JQuery 代码添加版本的方法:

<script type="text/javascript" src="js/script.js?v=1"></script>

查看v=1。下次更新 JQuery 代码时，将其更改为 v=2 以告诉浏览器您的代码已更改。