事件：是由访问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. 在搜索引擎中输入汉字就可以解析到对应的域名，请问如何用LoadRunner进行测试。

    建立测试计划,确定测试标准和测试范围 设计典型场景的测试用例,覆盖常用业务流程和不常用的业务流程等 根据测试用例,开发自动测试脚本和场景: 录制测试脚本:新建一个脚本(Web/HTML协议):点 ...

  2. 四元数和旋转(Quaternion & rotation)

    四元数和旋转(Quaternion & rotation) 本篇文章主要讲述3D空间中的旋转和四元数之间的关系.其中会涉及到矩阵.向量运算,旋转矩阵,四元数,旋转的四元数表示,四元数表示的旋转 ...

  3. 【函数分享】每日PHP函数分享(2021-1-7)

    ltrim() 删除字符串开头的空白字符(或其他字符). string ltrim ( string $str[, string $character_mask]) 参数描述str 输入的字符串. c ...

  4. 【Java基础】反射

    反射 反射的概述 反射(Reflection)是被视为动态语言的关键,反射机制允许程序在执行期借助 Reflection API 取得任何类的内部信息,并能直接操作任意对象的内部属性和方法. 加载完类 ...

  5. 【MySQL 基础】MySQL必知必会

    MySQL必知必会 简介 <MySQL必知必会>的学习笔记和总结. 书籍链接 了解SQL 数据库基础 什么是数据库 数据库(database):保存有组织的数据的容器(通常是一个文 件或一 ...

  6. 计算机考研真题 ZOJ问题

    题目描述 对给定的字符串(只包含'z','o','j'三种字符),判断他是否能AC. 是否AC的规则如下: 1. zoj能AC: 2. 若字符串形式为xzojx,则也能AC,其中x可以是N个'o' 或 ...

  7. NAS基础知识

    一.什么是NAS 1.NAS的定义 NAS(Network Attached Storage:网络附属存储)按字面简单说就是连接在网络上,具备资料存储功能的装置,因此也称为"网络存储器&qu ...

  8. ps 2020 下载

    一款极具实用价值的作图软件--ps,由于正版价格昂贵,所以这里分享破解版的资源.b话少说,下面是下载链接和安装步骤: 下载链接: 百度网盘链接:https://pan.baidu.com/s/1XPf ...

  9. 【MySQL】centos6中/etc/init.d/下没有mysqld启动文件，怎么办

    如果/etc/init.d/下面没有mysqld的话,service mysqld start也是不好使的,同样,chkconfig mysqld on也是不能用 解决办法: 将mysql的mysql ...

  10. EF Core 6.0的新计划

    今天,我们很兴奋地与你分享Entity Framework Core 6.0的计划. 这个计划汇集了许多人的意见,并概述了我们打算在哪里以及如何优化实体框架(EF Core) 6.0版本.这个计划并不 ...