on()方法用来处理事件。jQuery会处理所有浏览器的兼容性问题。

on()方法可以指定影响哪个事件,相当于JavaScript中的addEventListener()事件监听。

on()方法有两个参数:

第一个参数,是事件,同addEventListener()事件监听的第一个参数一样,用引号括起事件名。

第二个参数,是代码,可以命名函数,也可以是匿名函数。

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>事件方法</title>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js">
</script>
</head>
<body>
<div>
<ul id="ul">
<li id="a">鼠标</li>
<li id="b">键盘</li>
<li id="c">屏幕</li>
<li id="d"><a>主机</a></li>
</ul>
</div>
<script>
$('li').on('click',function(){
alert($(this).text());
});
</script>
</body>
</html>

  常见的jQuery事件

  • 用户界面:focus、blur、change
  • 键盘:input、keydown、keyup、keypress
  • 鼠标:click、dblclick、mouseup、mousedown、mouseover、mousemove、mouseout、hover
  • 表单:submit、select、change
  • 文档:ready、load、unload
  • 浏览器:error、resize、scroll

事件方法on()的更多相关文章

  1. jQuery 事件方法

    事件方法触发器或添加一个函数到被选元素的事件处理程序. 下面的表格列出了所有用于处理事件的 jQuery 方法. 方法 描述 bind() 向匹配元素附加一个或更多事件处理器 blur() 触发.或将 ...

  2. 【转】NGUI研究院之三种方式监听NGUI的事件方法(七)

    NGUI事件的种类很多,比如点击.双击.拖动.滑动等等,他们处理事件的原理几乎万全一样,本文只用按钮来举例. 1.直接监听事件 把下面脚本直接绑定在按钮上,当按钮点击时就可以监听到,这种方法不太好很不 ...

  3. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  4. js在控件原有的事件方法中加入自己的方法

    有没有碰到过这样的情况,在一个别人的页面上,你想为某个按钮加入自己的控制逻辑,满足条件的情况下才执行原有的事件方法呢? 这个时候在不能修改其原有方法的情况下,先获取控件的事件方法,并将其包装到自己的控 ...

  5. jQuery 事件 方法

    jQuery 事件方法 事件方法触发器或添加一个函数到被选元素的事件处理程序. 下面的表格列出了所有用于处理事件的 jQuery 方法. 方法 描述 bind() 向元素添加事件处理程序 blur() ...

  6. php 中的魔术方法-----“事件方法”

    来源:http://lornajane.net/posts/2012/phps-magic-__invoke-method-and-the-callable-typehint php 中的这个对象 , ...

  7. angular指令监听ng-repeat渲染完成后执行自定义事件方法

    今天工作中遇到需要用到ng-repeat遍历渲染完后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的指令,所以需要自己创建自定义指令. 在ng-repeat模板实例内部会暴露 ...

  8. jquery动态添加的元素不能直接应用事件方法的时候

    对于由 jQuery 动态生成的元素,如用 jQuery 给元素添加 class,或者直接添加一对 p 标签,不能直接绑定常用的事件,如 click.因为这些元素属于动态生成,除非采用 onclick ...

  9. Jq_DOM元素方法跟JQuery 核心函数跟JQuery 事件方法

    JQuery DOM 元素 函数                            描述 .get()                           从队列中删除所有未运行的项目. .ind ...

随机推荐

  1. webpack配置说明

    webpack是一个现代JavaScript应用程序的静态模块打包器. 它有几个核心概念: 一.entry(入口) 指示webpack应该使用哪个模块,来作为构建其内部依赖图的开始, 可以在webpa ...

  2. Weblogic常见故障常:JDBC Connection Pools【转】

    WebLogic Server中数据库连接池是一个经常出问题的地方,总结一下出问题的原因和解决办法. 一.数据库连接泄漏 此类问题一般都是由于开发人员没有正确关闭数据库连接造成的.比如使用完Conne ...

  3. 微信公众号绑定服务器 Flask版

    python 代码 from flask import Flask, request from flask_cors import CORS app = Flask(__name__) app.app ...

  4. Java入门系列(十二)Java反射

    Why--指的是为什么做这件事,也既事物的本质. 反射之中包含了一个“反”的概念,所以要想解释反射就必须先从“正”开始解释,一般而言,当用户使用一个类的时候,应该先知道这个类,而后通过这个类产生实例化 ...

  5. 【BZOJ】1443: [JSOI2009]游戏Game

    [算法]博弈论+二分图匹配(最大流) [题解]方格图黑白染色得到二分图, 二分图博弈:当起点不属于某个最大匹配时,后手必胜. 问题转化为那些点不属于某个最大匹配. 先找到一个最大匹配,非匹配点加入答案 ...

  6. text-decoration和text-indent和text-shadow

    text-decoration 属性规定添加到文本的修饰,规定划线的位置. <html> <head> <style type="text/css"& ...

  7. 第16月第31天 mongo

    1. 94  brew install  mongodb 95  cd ~ 96  cd Desktop/web/ 97  ls 98  mkdir mongo 99  cd mongo/ 100  ...

  8. 第16月第6天 vs2005 lseek directdraw

    1. //_lseek(file_handle, -(int)pbitmap->bitmapinfoheader.biSizeImage, SEEK_END); SetFilePointer(( ...

  9. Java基础中的一些概念理解

    同步 和 异步区别 同步和异步通常用来形容一次方法的调用. 同步方法调用一旦开始,调用者必须等到方法调用返回后,才能继续后续的行为.而异步方法调用更像一个消息传递,一旦开始,方法调用就会立即返回,调用 ...

  10. 闭包传递(floyed)

    题目链接: https://cn.vjudge.net/contest/66569#problem/H 题目大意: n代表母牛的个数,m代表给定的信息的组数.每一组数包括a,b. 代表b崇拜a(突然发 ...