JS常用事件大全

news2024/9/29 3:25:16

事件

事件通常与函数配合使用,这样就可以通过发生的事件来驱动函数执行。

注意:事件名称大小写敏感。若是事件监听方式,则在事件名的前面取消on。 

1. 鼠标事件

给btn按钮添加点击事件,点击弹出 你好! 

2. 键盘事件 

键盘按键被松开时触发,弹出 你好 !

window.onkeyup = function() {
    alert('你好!')

3. 触摸事件

 手指触摸盒子触发

let div = document.querySelector('div')
div.ontouchstart = function() {
    alert('您触摸了盒子')
}

 4. 表单事件

将表单内每次输入的内容打印到控制台 

let input = document.querySelector('input')
input.oninput = function() {
    console.log(this.value);
}

 5. 过渡事件

6. 动画事件 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1333746.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Hadoop】Zookeeper架构/特点

Zookeeper 中的角色主要有以下三类: Zookeeper需要保证高可用性和强一致性为了支持更多的客户端,需要增加更多Server,但是Server增多,意味着投票阶段延迟增大,会影响整个系统的性能。所以在3.3.0中ZK引入的新角色&…

Rebel + LlamaIndex 构建基于知识图谱的查询引擎

目录 一、Rebel解析非结构化数据 模型介绍 三元组 核心代码 二、LlamaIndex 构建知识图谱 三、整体处理流程 四、运行效果 五、完整代码 六、知识拓展 一、Rebel解析非结构化数据 模型介绍 Rebel模型是为端到端语言生成(REBEL)关系提取而设计的。它利用基于 BART 模…

操作系统 内存管理篇

一.程序的装入和链接 装入方式: 链接方式: 二.进程的内存映像 三.内存的分配 1.连续分配 分配方式: 2.不连续分配 分页:页面大小一致 引入快表(和 cache 处理思路一致) 升级到二级页表 分段:…

学习mongoDb到SpringBoot整合看这一篇就足够了

MongoDB 简介 MongoDB 是什么: MongoDB是一个基于文档的NoSQL数据库,用于处理大量的数据,并提供高性能、高可用性和易扩展性。相对于传统的关系型数据库,MongoDB采用文档的方式存储数据,每个文档是一组键值对的集合&…

自我学习--关于如何设计光耦电路

本人在项目中多次设计光耦电路,目前电路在项目中运行比较平稳,所以总结一下自己的设计经验,与大家交流一下,如有错误还希望大家指出改正,谢谢(V:Smt15921588263;愿与大家多交流&…

智能优化算法应用:基于战争策略算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用:基于战争策略算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用:基于战争策略算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.战争策略算法4.实验参数设定5.算法结果6.…

redis的主从复制和哨兵模式

redis的集群: 高可用方案: 持久化高可用 主从复制 哨兵模式 集群 主从复制:主从复制是redis实现高可用的基础,哨兵模式和集群都是在主从复制的基础之上实现高可用。 主从复制实现数据的多机备份,以及读写分离(主…

关于Python里xlwings库对Excel表格的操作(十七)

这篇小笔记主要记录如何【获取和设置单元格行高、列宽】。 前面的小笔记已整理成目录,可点链接去目录寻找所需更方便。 【目录部分内容如下】【点击此处可进入目录】 (1)如何安装导入xlwings库; (2)如何在W…

基于flask和echarts的新冠疫情实时监控系统源码+数据库,后端基于python的flask框架,前端主要是echarts

介绍 基于flask和echarts的新冠疫情实时监控系统 软件架构 后端基于python的flask框架,前端主要是echarts 安装教程 下载到本地,在python相应环境下运行app.py,flask项目部署请自行完成 使用说明 flaskProject文件夹中 app.py是flask项目主运行文…

BUG记录 | 使用阿里云OSS实现文件上传后,得到的url无法在浏览器中打开

项目背景 SpringBoot的项目,使用阿里云对象存储OSS对项目中的文件进行存储,所需文件也会通过IDEA中由官方Demo改编而成的工具类作为接口,调用接口后上传 问题描述 使用阿里云OSS实现文件上传后,通过postman测试得到的url无法在…

C# Onnx Yolov8 Detect yolov8n、yolov8s、yolov8m、yolov8l、yolov8x 对比

目录 效果 yolov8n yolov8s yolov8m yolov8l yolov8x 模型信息 项目 代码 下载 C# Onnx Yolov8 Detect yolov8n、yolov8s、yolov8m、yolov8l、yolov8x 对比 效果 yolov8n yolov8s yolov8m yolov8l yolov8x 模型信息 Model Properties ------------------------- d…

ubuntu22.04 下载路径

ftp下载路径 csdn下载 ubuntu22.04下载路径ubuntu-22.04-desktop-amd64.7z.001资源-CSDN文库 ubuntu22.04下载路径ubuntu-22.04-desktop-amd64.7z.002资源-CSDN文库 【免费】ubuntu-22.04-desktop-amd64.7z.003资源-CSDN文库 【免费】ubuntu-22.04-desktop-amd64.7z.004资源-…

Python 数据分析 Matplotlib篇 时间序列数据绘制折线图(第4讲)

Python 数据分析 Matplotlib篇 时间序列数据绘制折线图(第4讲)         🍹博主 侯小啾 感谢您的支持与信赖。☀️ 🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹…

【二叉树】【单调双向队列】LeetCode239:滑动窗口最大值

作者推荐 map|动态规划|单调栈|LeetCode975:奇偶跳 涉及知识点 单调双向队列 二叉树 题目 给你一个整数数组 nums,有一个大小为 k 的滑动窗口从数组的最左侧移动到数组的最右侧。你只可以看到在滑动窗口内的 k 个数字。滑动窗口每次只向右移动一位。 返回 滑动…

【GitHub精选项目】抖音/ TikTok 视频下载:TikTokDownloader 操作指南

前言 本文为大家带来的是 JoeanAmier 开发的 TikTokDownloader 项目,这是一个高效的下载 抖音/ TikTok 视频的开源工具。特别适合用户们保存他们喜欢的视频或分享给其他人。 TikTokDownloader 是一个专门设计用于下载 TikTok 视频的工具,旨在为用户提供一…

学习C语言可以从以下几个方面入手

学习C语言可以从以下几个方面入手: 了解基础知识:首先,你需要了解C语言的基本语法和规则,包括变量、数据类型、运算符、控制结构等。可以通过阅读相关的教材或在线教程来学习这些基础知识。动手实践:理论知识的学习是…

大数据应用开发1——配置基础环境

一、基础环境配置 1.配置虚拟网络 1.1、点击1、编辑2和3, 1.2、点开4,编辑网关 2、配置虚拟机环境 1.1、安装一台虚拟机,使用root用户登录,打开终端 1.2修改主机名 终端输入: vim /etc/hostname使用vim编辑/etc/ho…

linux异步IO的几种方法及重点案例

异步IO的方法 在Linux下,有几种常见的异步I/O(Asynchronous I/O)机制可供选择。以下是其中一些主要的异步I/O机制: POSIX AIO(Asynchronous I/O):POSIX AIO是一种标准的异步I/O机制&#xff0c…

自动驾驶学习笔记(二十二)——自动泊车算法

#Apollo开发者# 学习课程的传送门如下,当您也准备学习自动驾驶时,可以和我一同前往: 《自动驾驶新人之旅》免费课程—> 传送门 《Apollo开放平台9.0专项技术公开课》免费报名—>传送门 文章目录 前言 感知算法 定位算法 规划算法…

可靠度理论中“设计基准期”、“设计使用年限”、“使用寿命”几个概念的区分

文章目录 0. 背景1. 重现期2. 设计基准期3. 设计使用年限调整系数4. 一把杆秤5. 调整系数的补充说明Last 0. 背景 在可靠度理论中,经常遇见“设计基准期”、“设计使用年限”、“使用寿命”几个概念。这些概念搞不清楚对于梳理结构荷载组合而言就是致命的。本文也是…