javascript常用方法,解决浏览器中Backspace按键回退页面问题
js常用方法
- 1.javascript解决浏览器中Backspace按键回退页面问题
- 2.javascript解决页面禁止复制等操作
- 3.js获取上下左右按键操作,且滚动条不受影响
- 优质资源分享
1.javascript解决浏览器中Backspace按键回退页面问题
以下代码复制到页面即可解决,浏览器中Backspace按键回退页面问题
//判断操作返回时,阻止发生
function banBackSpace(e) {var ev = e || window.event;//各种浏览器下获取事件对象var obj = ev.relatedTarget || ev.srcElement || ev.target || ev.currentTarget;//按下Backspace键if (ev.keyCode == 8) {var tagName = obj.nodeName //标签名称//如果标签不是input或者textarea则阻止Backspaceif (tagName != 'INPUT' && tagName != 'TEXTAREA') {return stopIt(ev);}var tagType = obj.type.toUpperCase();//标签类型//input标签除了下面几种类型,全部阻止Backspaceif (tagName == 'INPUT' && (tagType != 'TEXT' && tagType != 'TEXTAREA' && tagType != 'PASSWORD')) {return stopIt(ev);}//input或者textarea输入框如果不可编辑则阻止Backspaceif ((tagName == 'INPUT' || tagName == 'TEXTAREA') && (obj.readOnly == true || obj.disabled == true)) {return stopIt(ev);}}}//通用阻止function stopIt(ev) {if (ev.preventDefault) {//preventDefault()方法阻止元素发生默认的行为ev.preventDefault();}if (ev.returnValue) {//IE浏览器下用window.event.returnValue = false;实现阻止元素发生默认的行为ev.returnValue = false;}return false;}//页面初加载$(function() {//实现对字符码的截获,keypress中屏蔽了这些功能按键document.onkeypress = banBackSpace;//对功能按键的获取document.onkeydown = banBackSpace;})
2.javascript解决页面禁止复制等操作
body标签后面加上
oncontextmenu='return false' //禁止右键
οndragstart='return false' //禁止拖动
onselectstart ='return false' //禁止选中
οnselect='document.selection.empty()' //禁止选中
οncοpy='document.selection.empty()' //禁止复制
onbeforecopy='return false' // 禁止复制
οnmοuseup='document.selection.empty()'
html案列源码-页面右键不起作用,页面不能复制
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
*{padding: 0;margin: 0;
}
.news {width: calc(100% - 50px);border: 1px solid gray;padding: 20px 15px ;margin: 10px;
}
.news h2{padding-bottom: 5px;color: orange;font-weight: bold;
}
.news ul{padding:5px 10px ;background: white;
}
.news ul li{list-style: none;height: 30px;line-height: 30px;border-bottom: 1px dashed gray;text-indent: 15px;font-size: 14px;
}
.news a{text-decoration: none;color: #06C;
}
.news a:hover{text-decoration: underline;color: red;
}</style><body oncontextmenu="return false" onbeforecopy="return false"><div class="news"><h2>CSDN 好的资源源码 - 记录保存</h2><ul><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124710999" target="_blank">★★★★★【博主推荐】html界面绘制SVG图形(附源码)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124689160" target="_blank">★★★★★【博主推荐】html下拉框树形(附好看的登录界面)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124686960" target="_blank">★★★★★【博主推荐】html操作SVG图(附源码)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124684028" target="_blank">★★★★★【博主推荐】HTML5响应式手机WEB(附源码)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124658533" target="_blank">★★★★★【博主推荐】SSM框架的后台管理系统(附源码)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124627153" target="_blank">★★★★★【博主推荐】html后台管理系统框架(附源码)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124624827" target="_blank">★★★★☆【博主推荐】大数据可视化大屏(源码下载)</a></li><li><a href="https://blog.csdn.net/weixin_43151418/article/details/124746163" target="_blank">★★★★☆【博主推荐】HTML制作一个美观的个人简介网页(附源码)</a></li><li><a href="" target="_blank">★★★★☆ </a></li></ul></div>
</body></html>
效果图
3.js获取上下左右按键操作,且滚动条不受影响
//控制键盘上下左右按钮document.onkeydown = function (event) {var e = event || window.event || arguments.callee.caller.arguments[0];if(e){switch(e.keyCode){case 37://←alert("单击了左按键");break;case 38://↑//点击键盘上下键,页面右侧滚动条不随之上下滚动if (e.preventDefault) {e.preventDefault();} else {e.returnValue = false;}alert("单击了上按键");break;case 39://→alert("单击了右按键");break;case 40://↓//点击键盘上下键,页面右侧滚动条不随之上下滚动if (e.preventDefault) {e.preventDefault();} else {e.returnValue = false;}alert("单击了下按键");break;}}};
优质资源分享
javascript常用方法,解决浏览器中Backspace按键回退页面问题相关推荐
- 解决vim中ESC按键延迟问题
解决vim中ESC按键延迟问题 ESC按键存在延迟有多种可能: vim按键映射使用了<ESC>组合按键,按下<ESC>后,vim在等待后续按键按下.一般情况下 我们没有必要映射 ...
- 深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 3
备注: 因为文章太长,所以将它分为三部分,本文是第三部分. 第一部分:深入浅出经典面试题:从浏览器中输入URL到页面加载发生了什么 - Part 1 第二部分:深入浅出经典面试题:从浏览器中输入URL ...
- [JavaScript] audio在浏览器中自动播放
audio 在浏览器中自动播放 autoplay 属性 autoplay 属性规定一旦音频就绪马上开始播放. 如果设置了该属性,音频将自动播放. 使用 autoplay 属性进行播放 //使用auto ...
- JavaScript 在各个浏览器中执行的耐性
IE:执行超过500W条JScript引擎语句出现提示. Firefox:执行超过10秒出现提示. Safari:执行超过5秒出现提示. Opera:无论执行多久都不会出现提示,最有耐性. C ...
- android浏览器音频播放器,javascript – 在Android浏览器中播放html5音频
我有一个JavaScript在浏览器中播放音频,使用html5< audio>标签.它在iPhone浏览器中工作正常,但不在Android中. (使用Android 2.1测试使用htc愿 ...
- vuex页面数据丢失_解决 vuex 中的数据在页面刷新之后就丢失的问题
在vue的项目中我们一般都会使用到vuex,在vuex中我们会保存一个需要全局使用的变量或者状态,这样方便我们使用.但是vuex的store中的数据有一个特性,那就是在页面刷新时,页面会重新加载vue ...
- 从在浏览器中输入URL到页面渲染出来的完整过程是怎样的?
从宏观上看,主要包括以下几个步骤:域名解析.建立连接.发送请求.响应数据.关闭连接.下面以在Chrome浏览器中输入https://yq.aliyun.com/articles/580962为例,讨论 ...
- 解决华为手机虚拟按键遮挡页面底部tab栏的问题
谷歌原生,华为之类的虚拟按键遮挡页面底部RadioButton之类的问题. if (AndroidWorkaround.checkDeviceHasNavigationBar(this)) { //适 ...
- Debina解决浏览器中乱码(将系统字体改为中文)
在安装debian系统的时候如果选择使用中文作为操作系统的字体,但在安装过程中并没有联网进行同步更新,那么很可能在debian系统安装成功以后出现所有中文文字都是小方块数字字母及黑块问号的情况(如第一 ...
- 解决浏览器中的小logo图标显示问题 icon
在html中添加一下标签即可 <link rel="icon" href="./images/favicon.ico" th:href="@{/ ...
最新文章
- 20145328 《网络对抗技术》恶意代码分析
- Oracle之 11gR2 RAC 修改监听器端口号的步骤
- 今年2月的微盟“删库”主角被判 6 年有期徒刑
- 内联汇编 - 从头开始
- 【数字信号处理】周期序列 ( 正弦序列特性 | 单个模拟周期采集 m 个数字样本 | Q 个模拟周期采集 P 个数字样本 | 非周期序列的情况 | 数字信号周期 )
- c# 弹性和瞬态故障处理库Polly
- 网络营销理论模型_网络营销:课堂笔记(第四章下)
- Office Web Apps安装部署(二)
- 程序员面试金典 - 面试题 08.10. 颜色填充(BFS/DFS)
- java 课后习题 随机整数最大值和最小值
- QQ音乐全新上线HiRes高解析音质 听歌体验再升级
- eclipse如何显示行数
- c语言用三目运算符从小到大排列,错题集
- APUE习题[实现dup2函数功能,不使用fcntl]
- 手把手教您编写第一个单片机程序
- 劳务派遣有五险一金吗?
- Android底部导航栏的三种风格实现
- [报错] SyntaxError: Missing parentheses in call to ‘exec‘
- Qt实现多摄像头的识别、显示、截图、分辨率帧率设置等功能
- 微软surface屏幕测试软件,【微软 Surface Pro 3 平板电脑使用感受】屏幕|软件_摘要频道_什么值得买...