("click"上的 JavaScript 无法正常工作

标签 javascript jquery

由于某种原因,我的点击 JS 无法正常工作。我已经标记了 id 和 class。

<!DOCTYPE html>

<head>
   <link rel="stylesheet" type="text/css" href="css/style.css">
   <script type='text/javascript' src="js/index.js"></script>

   <script>
       $(document).ready(function(){
         alert("Hello World");
       });
   </script>
</head>


<div class="container-fluid">
  <div class = "row text-center">
    <h2>Cat Photo Finder</h2>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message">
      The message will go here
    </div>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12">
      <button id = "getMessage" class = "btn btn-primary">
        Get Message
      </button>
    </div>
  </div>
</div>

这是 Javascript。

  $(document).ready(function() {
     // Only change code below this line.
     $("#getMessage").on("click", function(){
         $(".message").html("Get message");
     });
     // Only change code above this line.
  });

我真的很感激一些见解!非常感谢。我的假设是 index.js 文件没有正确链接,但 src 绝对是正确的。

最佳答案

$(document).ready(function() {
   
    $("#getMessage").on("click", function(){
      alert('You Clicked..!!');
    });
    
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-fluid">
  <div class = "row text-center">
    <h2>Cat Photo Finder</h2>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12 well message">
      The message will go here
    </div>
  </div>
  <div class = "row text-center">
    <div class = "col-xs-12">
      <button id = "getMessage" class = "btn btn-primary">
        Get Message
      </button>
    </div>
  </div>
</div>

您忘记包含脚本,如果没有,您可能未对齐脚本文件,请先加载它。

关于("click"上的 JavaScript 无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40433282/

相关文章:

javascript - 在表单中使用 onsubmit 而不是 onchange 时无法获取图像

javascript - 如何只查找父页面上的对象但排除iframe下的对象

javascript - 如何以与 vivus.js 类似的风格制作 SVG 填充和路径动画

javascript - jquery ui自动完成获取所选选项的值

javascript - 如何在加载图片(在网络中)时向用户显示 gif 动画?

javascript - VivagraphJS、WebGL 和事件监听器

javascript - 将事件监听器添加到文档,而不是检查元素是否存在,然后添加事件监听器

jquery - 从 mod_python 返回 xml 时 jQuery 中出现解析错误

javascript - Bootstrap Multiselect 插件显示 'all selected'

javascript - 清除表单输入(某些控件除外)