FCC-JS-JQ-Trigger Click Events with jQuery-通过jQuery来绑定点击事件

通过jQuery来绑定点击事件。
首先,我们来看一下函数

$(document).ready() 

干了些什么。
这个函数中的代码只会在我们的页面加载时候运行一次,确保执行js之前页面所有的dom已经准备就绪。
任务:给"Get Message"按钮绑定一个点击事件。
我们先在$(document).ready()函数中增加一个click事件。代码如下:

$(document).ready()function by adding this code: 

$("#getMessage").on("click", function(){
});
<script>
  $(document).ready(function() {
    // 请把你的代码写在这条注释以下
    $("#getMessage").on('click',function(){
     alert("whh");
    });
    // 请把你的代码写在这条注释以上
  });
</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>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 通过jQuery,您可以选取(查询,query)HTML元素,并对它们执行“操作”(actions)。 jQuer...
    枇杷树8824阅读 671评论 0 3
  • JavaScript和HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的。 jQuery增加并扩...
    DHFE阅读 638评论 0 1
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,749评论 1 45
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,379评论 0 2
  • 1 月亮透过乌云将斑驳的光艰难地扔了下来,旷野里阴晴不定,各种影子混杂在一起,有些吓人。高速路上路灯发出微弱的光,...
    刘笑东阅读 697评论 3 6