在一般的情况下,我们在浏览网页的时候按下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方法的更多相关文章

  1. 浏览器中F5和CTRL F5的行为区别及如何强制更新资源

    一.浏览器中F5和CTRL F5的行为区别 我们直接来看效果,下面是我打开qq网页,分别使用F5和CTRL F5,我们来看区别. F5: CTRL F5: 区别: 首先直观上的区别是CTRL F5明显 ...

  2. 解决Safari高版本浏览器中默认禁用第三方COOKIE(含demo)

    前段时间在项目里遇到了一个比较头疼的问题,就是高版本的Safari中默认会阻止第三方cookie,这使得使用Safari浏览器的用户无法按照正常的业务逻辑进行操作. 问题展现 知识点 什么是第三方co ...

  3. 浏览器中F5和CTRL F5的行为区别

    前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为也是刷新页面,但是会清除浏览器缓存,这在前端调试时候会常用.二者真正的区别是什么呢?在stackove ...

  4. 【转】浏览器中F5和CTRL F5的行为区别

    原文地址:http://www.cnblogs.com/jiji262/p/3410518.html 前言 在印象中,浏览器中的F5和刷新按钮是一样的效果,都是对当前页面进行刷新:Ctrl-F5的行为 ...

  5. 在IE浏览器中执行OpenFlashChart的reload方法时无法刷新的解决方法

    由于项目需求,需要在网页上利用图表展示相关数据的统计信息,采用了OpenFlashChart技术.OpenFlashChart是一款开源的以Flash和Javascript为技术基础的免费图表,用它能 ...

  6. 极其简单的用JS在浏览器中创建下载文件的方法

    有这样一个需求,在js中动态创建一个页面,然后下载该页面为word文档,研究了一上午,最后发现实现起来如此简单. 在js中创建如下方法:(直接复制即可) function downloadFile(f ...

  7. <input/>标签在 苹果浏览器中 默认的有圆角

    解决方法: input{ border-radius:0; -webkit-border-radius:0; }

  8. 改变浏览器页面默认滚动条样式scrollbar

    scrollbar-3d-light-color 设置或检索滚动条亮边框颜色scrollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色sc ...

  9. ios系统微信浏览器、safari浏览器中h5页面上拉下滑导致悬浮层脱离窗口的解决方法

    一. 运行环境: iphone所有机型的qq浏览器,safari浏览器,微信内置浏览器(qq浏览器内核)等. 二. 异常现象: 1. 大幅度上下滑动h5页面,然后停止滑动,有时候会影响到页面滚动,如局 ...

随机推荐

  1. PyCharm下载主题以及个性化设置(详细)

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 一.下载主题 1.在http://www.themesmap.com/theme.html上选择自己喜欢的主题点进去后进行下载. ...

  2. 在 Windows 10 x64 上安装及使用 ab 工具的流程

    本文转自:www.shuijingwanwq.com/2017/04/18/1568/ 1.基于AB测试工具进行高并发情形下的模拟测试,打开:http://httpd.apache.org/docs/ ...

  3. 关于Altium Designer的BOM,元件清单

    在生成BOM列表的时候,要记得调整BOM的表格的宽度,以免显示不全, 还有就是BOM列表一共有 comment栏 ,description栏,designator栏,footprint栏,libref ...

  4. PHP 分布式集群中session共享问题以及session有效期的设置

    https://blog.csdn.net/m_nanle_xiaobudiu/article/details/81177698

  5. SpringBoot错误信息总结(不定时更新)

    1." java.lang.IllegalStateException: @Bean method ShiroConfig.cacheManager called as a bean ref ...

  6. 【BZOJ 3675】[Apio2014]序列分割

    [链接] 链接 [题意] 在这里输入题意 [题解] 模拟一下样例. 会发现.切的顺序不影响最后的答案. 只要切点确定了. 答案就确定了. 则设f[i][j]表示前i段,第i段保留到j的最大值. \(f ...

  7. 【u249】新斯诺克

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 斯诺克又称英式台球,是一种流行的台球运动.在球桌上,台面四角以及两长边中心位置各有一个球洞,使用的球分 ...

  8. SDL2源码分析1:初始化(SDL_Init())

    ===================================================== SDL源码分析系列文章列表: SDL2源码分析1:初始化(SDL_Init()) SDL2源 ...

  9. 【hdu5527】【2015ACM/ICPC亚洲区长春站 】Too Rich

    题目链接: pid=5527">http://acm.hdu.edu.cn/showproblem.php?pid=5527 题意&题解: 感觉自己真是弱啊,自己想的贪心是错的 ...

  10. MyCAT分表初体验

    1.mycat二进制包安装 下载地址:http://dl.mycat.io/ tar -zxvf Mycat-server-1.6.5-release-20180122220033-linux.tar ...