事件:是由访问Web页面的用户引起一系列操作。

事件的作用:用于浏览器和用户的交互


以下代码为相关试验代码:

HTML事件:

<script type="text/javascript">
window.onload = function(){
//获取元素
var a = document.getElementById('a');
var b = document.getElementById('b');
//添加一个内容改变监听事件
a.oninput = function(){
//把a的文本输入框内容覆盖给b
b.innerText = a.value;
}
//兼容IE9以下版本
a.onpropertychange= function(){
//把a的文本输入框内容覆盖给b
b.innerText = a.value;
}
}
</script> <body>
<input type="text" id="a" value=""/>
<div id="b"></div>
</body>

键盘事件

<script type="text/javascript">
window.onload=function() {
window.onkeypress=function(e) {
//按键键码
if(e.charCode==103) {
alert('G健被点击')
}
}
}
</script>

鼠标单击、双击事件

<script>
window.onload = function() {
function dbl(){
alert('按钮被双击');
}
var input = document.getElementById('b');
input.onclick = function() {
alert('按钮被点击');
}
var c = document.getElementById('c');
/* c.ondblclick = function(){
alert('按钮被双击');*/ c.ondblclick = dbl;
}
}
</script> <body>
<input type="button" id="b" value="点击"/>
<input type="button" id="c" value="点击"/>
</body>

JavaScript——事件的更多相关文章

  1. JavaScript事件代理和委托(Delegation)

    JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委 ...

  2. JavaScript事件概览

    JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...

  3. 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  4. JavaScript 事件

    事件 概念:事件是可以被 JavaScript 侦测到的行为. JavaScript 使我们有能力创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触 ...

  5. JavaScript事件详解-jQuery的事件实现(三)

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  6. JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  7. 总结JavaScript事件机制

    JavaScript事件模型 在各种浏览器中存在三种事件模型: 原始事件模型 , DOM2事件模型 , IE事件模型. 其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE ...

  8. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  9. JavaScript事件流原理解析

    一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...

  10. Javascript事件机制兼容性解决方案

    本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...

随机推荐

  1. 总结JAVA语言的十大特性

    JAVA语言的十大特性 1.简单 Java语言的语法简单明了,容易掌握从,而且Java语言是纯面向对象的语言. Java语言的语法规则和C++类似,从某种意义上来讲,Java原因是由C语言和C++语言 ...

  2. Java学习日报7.20

    //7.20 三个和尚比身高import java.util.Scanner; //导包public class Hello{ public static void main(String[] arg ...

  3. HIve中 datediff,date_add和date_sub的用法

    1.日期比较函数:datediff语法:datediff(string enddate,string startdate) 返回值:int 说明:返回结束日期减去开始日期的天数. 例如: hive&g ...

  4. 2020再见&新的计划(建立Android体系架构)

    2020,再见 关于2020,我心中有四个关键词: 疫情 年初突如其来的疫情,打破了原本生活的节奏,也没想到会笼罩全世界整整一年,希望这个世界早点好起来吧. 科比 初三的早晨,噩耗传来,我一度不敢相信 ...

  5. CPU性能测试——CoreMark篇

    本文将介绍使用CoreMark测试程序对我们小组自研芯片进行性能的测试,记录了CoreMarK工具的使用以及对其测试结果进行分析 测试环境: PC OS: Ubuntu20.04 LTS CPU: 自 ...

  6. Game of Sum

    可以知道整体石子的总和一定的,所以一个人的得分越高,另一个人的得分就越低.不管怎么取任意时刻游戏的状态都是原始序列的一段连续子序列(即被玩家取剩下的序列). 因此,用d(i,j)表示玩家A在i到j部分 ...

  7. Java 中的 equals() 和 hashCode()

    equals() 和 hashCode() 在 Object 类中以本地方法的形式存在,Java 中所有的类都继承了 Object 类,因此所有的类中都包含了这两个方法.这两个方法在 Java 开发中 ...

  8. MQ for linux安装与卸载【转】

    MQ for linux安装与卸载[转] 一.安装步骤:1. 用root帐号登录系统2. MQ安装程序需将代码安装到目录/opt/mqm下,将数据保存到目录/var/mqm下,需确保相关目录下有足够的 ...

  9. LeetCode707 设计链表

    设计链表的实现.您可以选择使用单链表或双链表.单链表中的节点应该具有两个属性:val 和 next.val 是当前节点的值,next 是指向下一个节点的指针/引用.如果要使用双向链表,则还需要一个属性 ...

  10. Openstack Keystone 认证服务(四)

    Openstack Keystone 认证服务(四) keystone 的安装完全依赖ocata的源, 如果没有建议自己搭建. 否则用的源不对会产生各种奇葩问题. 创建keystone库和用户: ## ...