JavaScript——事件
事件:是由访问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——事件的更多相关文章
- JavaScript事件代理和委托(Delegation)
JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委 ...
- JavaScript事件概览
JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...
- 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)
前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...
- JavaScript 事件
事件 概念:事件是可以被 JavaScript 侦测到的行为. JavaScript 使我们有能力创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触 ...
- JavaScript事件详解-jQuery的事件实现(三)
正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...
- JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】
正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...
- 总结JavaScript事件机制
JavaScript事件模型 在各种浏览器中存在三种事件模型: 原始事件模型 , DOM2事件模型 , IE事件模型. 其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE ...
- 解析Javascript事件冒泡机制
本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...
- JavaScript事件流原理解析
一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...
- Javascript事件机制兼容性解决方案
本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...
随机推荐
- 关于一台电脑使用多个GitHub账户管理代码的记录
@参考原文 记录这个操作是因为需要将一些代码放出去到公共仓库上以便使用github pages线上预览今天页面的功能,但是碰到了一个很狗血的问题,虽然最后莫名其妙的解决了,但还是不知缘由,希望能在评论 ...
- Nginx压力测试问题
[root@aa~]# This is ApacheBench, Version 2.3 <Revision:655654Revision:655654> Copyright 1996 A ...
- WebService 适用场合
适用场合 1.跨防火墙通信 如果应用程序有成千上万的用户,而且分布在世界各地,那么客户端和服务器之间的通信将是一个棘手的问题.因为客户端和服务器之间通常会有防火墙或者代理服 务器.在这种情况下,使用D ...
- INNER JOIN、LEFT JOIN、RIGHT JOIN、FULL JOIN 的使用和区别
INNER JOIN:如果表中有至少一个匹配,则返回行 LEFT JOIN:即使右表中没有匹配,也从左表返回所有的行 RIGHT JOIN:即使左表中没有匹配,也从右表返回所有的行 FULL JOIN ...
- 7.24,《C Primer Plus》复习第十五章第二小题
编写一个程序,通过命令行参数读取两个二进制字符串,对这两个二进制数使用~运算符,&运算符.|运算符,并以二进制字符串形式打印结果(如果无法使用命令行环境,可以通过交互式让程序读取字符串) 编写 ...
- Solon rpc 之 SocketD 协议 - 消息加密模式
Solon rpc 之 SocketD 协议系列 Solon rpc 之 SocketD 协议 - 概述 Solon rpc 之 SocketD 协议 - 消息上报模式 Solon rpc 之 Soc ...
- LeetCode232 用栈实现队列
使用栈实现队列的下列操作: push(x) -- 将一个元素放入队列的尾部. pop() -- 从队列首部移除元素. peek() -- 返回队列首部的元素. empty() -- 返回队列是否为空. ...
- Python_列表(list)
list()类中的提供的操作 1.索引取值 li = [11,22,33,44,55] v1 = li[3] print(li[2]) #索引取出33 print(v1) #索引取出44 print( ...
- Openstack dashboard 仪表盘服务 (八)
Openstack dashboard 仪表盘服务 (八) # 说明: 这个部分将描述如何在控制节点上安装和配置仪表板.dashboard仅在核心服务中要求认证服务.你可以将dashboard与其他服 ...
- 四:WEB源码扩展
前言:WEB源码在安全测试中是非常重要的信息来源,可以用来进行代码审计漏洞也可以用来做信息突破口,其中WEB源码有很多技术需要简明分析,获取某ASP源码后就可以采用默认数据库下载为突破,获取某其他脚本 ...