改变浏览器中默认的ctrl+s方法
但是在一些特定的网页中,我们希望ctrl+s不是弹出默认的保存窗口,而是进行一下别的操作。
比如在我们使用简书的时候,我们按下ctrl+s的时候,是不会弹出保存窗口的。而是把我们正在编辑的文字进行保存。这个操作在一些特定的网页中是十分必要的。因为我们在编辑的文字的时候,会习惯性地按下ctrl+s进行保存,如果这个时候弹出保存窗口的话,肯定是不方便的。
<script>
document.addEventListener("keydown", function(e) {
//可以判断是不是mac,如果是mac,ctrl变为花键
//event.preventDefault() 方法阻止元素发生默认的行为。
if (e.keyCode == 83 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey)) {
e.preventDefault();
// Process event...
document.getElementById("test").innerHTML = "ctrl+s成功";
}
}, false);
</script>
在网页中加入以上的代码,就可以改变ctrl+s的默认操作。
- 1.首先添加keydown事件,在键盘按下的时候进行操作
- 2.判断按下的按键是什么,
e.keyCode = 83
是s键 - 3.之后判断一下用户的操作系统,如果我们的系统是MacOS,我们就判断花键即
e.metaKey
,
如果是windows我们就判断ctrl键即e.ctrlKey
- 4.如果是ctrl+s键被按下了,那这个时候我们使用
event.preventDefault()//这个方法阻止元素发生默认的行为
转自简书 改变浏览器中默认的ctrl+s方法
改变浏览器中默认的ctrl+s方法的更多相关文章
- 浏览器中F5和CTRL F5的行为区别及如何强制更新资源
一.浏览器中F5和CTRL F5的行为区别 我们直接来看效果,下面是我打开qq网页,分别使用F5和CTRL F5,我们来看区别. F5: CTRL F5: 区别: 首先直观上的区别是CTRL F5明显 ...
- 解决Safari高版本浏览器中默认禁用第三方COOKIE(含demo)
前段时间在项目里遇到了一个比较头疼的问题,就是高版本的Safari中默认会阻止第三方cookie,这使得使用Safari浏览器的用户无法按照正常的业务逻辑进行操作. 问题展现 知识点 什么是第三方co ...
- 浏览器中F5和CTRL F5的行为区别
前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为也是刷新页面,但是会清除浏览器缓存,这在前端调试时候会常用.二者真正的区别是什么呢?在stackove ...
- 【转】浏览器中F5和CTRL F5的行为区别
原文地址:http://www.cnblogs.com/jiji262/p/3410518.html 前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为 ...
- 在IE浏览器中执行OpenFlashChart的reload方法时无法刷新的解决方法
由于项目需求,需要在网页上利用图表展示相关数据的统计信息,采用了OpenFlashChart技术.OpenFlashChart是一款开源的以Flash和Javascript为技术基础的免费图表,用它能 ...
- 极其简单的用JS在浏览器中创建下载文件的方法
有这样一个需求,在js中动态创建一个页面,然后下载该页面为word文档,研究了一上午,最后发现实现起来如此简单. 在js中创建如下方法:(直接复制即可) function downloadFile(f ...
- <input/>标签在 苹果浏览器中 默认的有圆角
解决方法: input{ border-radius:0; -webkit-border-radius:0; }
- 改变浏览器页面默认滚动条样式scrollbar
scrollbar-3d-light-color 设置或检索滚动条亮边框颜色scrollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色sc ...
- ios系统微信浏览器、safari浏览器中h5页面上拉下滑导致悬浮层脱离窗口的解决方法
一. 运行环境: iphone所有机型的qq浏览器,safari浏览器,微信内置浏览器(qq浏览器内核)等. 二. 异常现象: 1. 大幅度上下滑动h5页面,然后停止滑动,有时候会影响到页面滚动,如局 ...
随机推荐
- JAVA开发类似冒险岛的游戏Part1
JAVA开发类似冒险岛的游戏Part1 一.总结 二.JAVA开发类似冒险岛的游戏Part1 初学嘛) ,不过总的来说这个程序还是很有意思的.这里我重新再整理了一下,希望能帮助到其他想要开发类似程序的 ...
- vue使用(三)
本节目标:获取后端api数据 需求:一个按钮,点击之后将服务器上的数据获取到,并显示出来 方法一: 1. 准备工作, (1)安装官方插件 vuedemo02>npm install vue-re ...
- JS学习笔记 - 自定义右键菜单、文本框只能输入数字
<script> // 事件总共有2个部分, //1.点击鼠标右键的表现 oncontextmenu 2.点击鼠标左键的表现(即普通点击onclick) // 点击右键,div位置定位到鼠 ...
- [React] Close the menu component when click outside the menu
Most of the time, your components respond to events that occur within the component tree by defining ...
- LA 4329 - Ping pong 树状数组(Fenwick树)
先放看题传送门 哭瞎了,交上去一直 Runtime error .以为那里错了. 狂改!!!!! 然后还是一直... 继续狂改!!!!... 一直.... 最后发现数组开小了.......... 果断 ...
- ORACLE中的Net Configuration Assistant 点击后无反应, sqlplus登录数据库提示Oracle11g ORA-12560: TNS: 协议适配器错误
首先是对于点击无反应问题: 如果是客户端下的Net Configuration Assistant可用,而服务器端的Net Configuration Assistant等工具不可用的原因如下. 环境 ...
- SoC编译HEX脚本(基于RISC-V的SoC)
SoC编译HEX脚本(基于RISC-V的SoC) 脚本使用 ./compile hello 脚本:设置RISC-V工具链riscv_set_env ############## RISC-V #### ...
- ORACLE RMAN备份及还原 RMAN能够进行增量备份:数据库,表空间,数据文件
ORACLE RMAN备份及还原 RMAN能够进行增量备份:数据库.表空间.数据文件 仅仅有使用过的block能够被备份成backup set 表空间与数据文件相应关系:dba_data_file ...
- Android多线程研究(8)——Java中的原子性理解
一.什么是原子性 原子性是世界上最小单位,具有不可分割性.比如a=0;(a非long和double类型)这个操作是不可分割的,那么我们说这个操作是原子操作.再比如:a++;这个操作实际上是a=a+1; ...
- AForge,Emgu.CV抓拍图像大小
原文:AForge,Emgu.CV抓拍图像大小 2017年,忙忙碌碌地过去了,象往年一样,依然没有时间上CSDN,博客园. 这一年是打工以来最辛苦的一年. 这一年用了不少自己没有接触过的东西.如人脸识 ...