zoukankan      html  css  js  c++  java
  • JQuery中on()函数详解

    JQuery API中定义的on方法,专业名词很多,读起来并不是那么容易,而对于开发人员知道函数怎么使用就可以了。本文将JQuery的说明翻译如下:

    on(events,[selector],[data],fn)

    events:事件名,必写参数

    [selector]:子元素选择器名,选填参数

    [data]:事件触发时,传入函数的参数,可通过event.data对象获取,选填参数

    fn:事件触发时所执行的动作,必写参数

    示例:
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript" src="../../jquery-3.1.0.js"></script>
    <script type="text/javascript">
    $(function(){
     $("#fatherDiv").on("click","#sonBtn",{id:1,name:"john"},function(event){
      var name = event.data.name;
      console.log("name == " + name);
     });
    });
    </script>
    </head>
    <body>
     <div  id ="fatherDiv" style="200px; height:200px;">
      <button id="sonBtn">按钮</button>
     </div>
    </body>
    </html>

    点击div中的button按钮会触发click事件,在事件函数中通过event.data.key获取对象中key的对应value值。

  • 相关阅读:
    day10函数名称空间与作用域(3)
    day10函数参数使用(2)
    day10函数基础(1)
    文件处理
    vue打包时semver.js版本报错
    js修改日期
    vue click事件获取当前元素属性
    js截取关键字之后的字符串
    css 清除浮动
    纯CSS绘制三角形
  • 原文地址:https://www.cnblogs.com/minshia/p/6250391.html
Copyright © 2011-2022 走看看