當我點擊按鈕時，沒有任何反應

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 個選擇。

刪除瀏覽器歷史記錄
按Ctrl + F5刷新瀏覽器（首選用於開發目的）
通過為它添加一個版本來告訴瀏覽器此 JQuery 代碼已更改。 當您在服務器上發布代碼時使用它，因為您無法通過按Ctrl + F5要求您的客戶刪除他們的瀏覽器歷史記錄或加載您的頁面

以下是向 JQuery 代碼添加版本的方法：

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

看看v=1 。 下次更新 JQuery 代碼時，將其更改為v=2以告訴瀏覽器您的代碼已更改。

Answer 2

你可以試試下一個

首先，我認為您的 HTML 標記可能是錯誤的，因為您沒有正確指出文件夾。 我通過 CDN 附加了所有的 css 和 js bootstrap + jquery 文件。

<!DOCTYPE html>
 <html>
   <head>
   <meta charset="utf-8">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
   <script 
    src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"</script>
    <script type="text/javascript" src="js/script.js"></script>
    <link rel="stylesheet" 
 href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <title> jQuery button click event working?</title>
</head>
<body>
  <div id="searchMovieBtnBox">
    <button class="btn btn-primary" type="button" id="searchMovieBtn">Search</button>
  </div>
  </body>
 </html>

因此，您的 script.js 保持原樣。 對我來說，它是這樣工作的。 我將消息打印到我的控制台上。 希望能幫到你。

Answer 3

確保 HTML 中沒有其他具有相同 id 的元素。

當我點擊按鈕時，沒有任何反應

問題描述

3 個解決方案

解決方案1
1 已采納 2020-01-19 12:39:33

解決方案2
0 2020-01-18 12:32:10

解決方案3
0 2020-01-19 20:43:51

當我點擊按鈕時，沒有任何反應

問題描述

3 個解決方案

解決方案1 1 已采納 2020-01-19 12:39:33

解決方案2 0 2020-01-18 12:32:10

解決方案3 0 2020-01-19 20:43:51

解決方案1
1 已采納 2020-01-19 12:39:33

解決方案2
0 2020-01-18 12:32:10

解決方案3
0 2020-01-19 20:43:51