【js】鼠标禁止右键禁止打开控制台及键盘禁用

简介: 前言大家好,今天和大家分享一下在前端js中禁止鼠标在浏览器中右键,禁止鼠标选中和禁止键盘按键。这个方法是我在制作一个单词考核系统时所使用到的,因为在考试期间如果打开控制台,通过控制台找到了正确的答案,那么就没有意义了。所以就需要将控制台禁用,所应用到的也是一些基础的知识,下面我们就一起来看一看吧

前言

大家好,今天和大家分享一下在前端js中禁止鼠标在浏览器中右键,禁止鼠标选中和禁止键盘按键。

这个方法是我在制作一个单词考核系统时所使用到的,因为在考试期间如果打开控制台,通过控制台找到了正确的答案,那么就没有意义了。

所以就需要将控制台禁用,所应用到的也是一些基础的知识,下面我们就一起来看一看吧

一、禁用

1. 禁用鼠标右键

document.oncontextmenu = new Function("event.returnValue=false");

oncontextmenu是JavaScript中的一个事件属性,用于在用户右击鼠标时触发相应的事件处理程序。当用户右击鼠标时,浏览器会显示一个上下文菜单,该属性可以用于阻止默认的上下文菜单行为,或者自定义右键菜单的行为。

2. 禁用鼠标选中

document.onselectstart = new Function("event.returnValue=false");

onselectstart是一个事件处理程序属性,它在用户开始选择文本时触发。它可以用于防止用户选择文本或在拖动元素时选择文本。

3. 禁用键盘F12

 document.addEventListener("keydown", function (e) {
    console.log(e。key);
        if (e.key == "F12") {
          e.preventDefault(); // 如果按下键F12,阻止事件
        }
    });

除了上面的写法外还有其他的一些写法。

document.onkeydown = () => {
  console.log(window.event.keyCode);
  for (let i = 9; i < 47; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  for (let i = 58; i < 65; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  for (let i = 91; i < 300; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  // 禁用ctrl+shift+i
  if (window.event.ctrlKey && window.event.shiftKey && window.event.keyCode == 73) {
    return false;
  }
  if (window.event.shiftKey) {
    return false;
  }
  // 禁用ctrl+r
  if (window.event.ctrlKey && window.event.keyCode == 82) {
    return false;
  }
}

onkeydown是JavaScript中的事件处理程序,它在用户按下键盘上的任何键时触发。可以将onkeydown事件与JavaScript函数一起使用,以便在用户按下键时执行某些操作。例如,可以使用onkeydown事件来捕获用户按下Enter键并提交表单。


可以根据自己的需要来禁用按键,这个是我的项目需要所以加了禁用其它的键盘按键,上面的这个ctrl+shift+i也是可以打开浏览器的。

二、所有代码

// 1.禁用右键菜单
document.oncontextmenu = new Function("event.returnValue=false");
// 2.禁用鼠标选中
document.onselectstart = new Function("event.returnValue=false");
document.onkeydown = () => {
  console.log(window.event.keyCode);
  for (let i = 9; i < 47; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  for (let i = 58; i < 65; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  for (let i = 91; i < 300; i++) {
    if (window.event && window.event.keyCode == i) {
      return false;
    }
  }
  // 禁用ctrl+shift+i
  if (window.event.ctrlKey && window.event.shiftKey && window.event.keyCode == 73) {
    return false;
  }
  if (window.event.shiftKey) {
    return false;
  }
  // 禁用ctrl+r
  if (window.event.ctrlKey && window.event.keyCode == 82) {
    return false;
  }
}

总结

最后偷偷的告诉大家,还有一个可以打开控制台的方法,哪就是在刷新浏览器页面时同时按下F12,这样也是可以打开的,所以在这个项目中我对刷新也做了一些操作。

这个打开控制台的方法大家可以试一下,但是要先把F12给禁止了,不然搞错了还不知道,这个方法不是特别容易打开,要多尝试几次。

以上就是本章的全部内容了,感谢您的阅读,希望能够帮助到您。


相关文章
|
1月前
|
JavaScript 前端开发
JavaScript实现鼠标放上去之后高亮显示且隔行换色
JavaScript实现鼠标放上去之后高亮显示且隔行换色
13 0
|
2月前
|
JavaScript 前端开发 算法
Node.js 艺术:用代码打印出绚丽多彩的控制台柱状图
Node.js 艺术:用代码打印出绚丽多彩的控制台柱状图
41 0
|
5月前
|
JavaScript
Sublime Text3 直接运行js调试控制台
Sublime Text3 直接运行js调试控制台
|
6月前
|
Web App开发 移动开发 JavaScript
【前端用法】HTML5 Video标签如何屏蔽右键视频另存为的js代码以及如何禁用浏览器控件,Video 禁止鼠标右键下载
【前端用法】HTML5 Video标签如何屏蔽右键视频另存为的js代码以及如何禁用浏览器控件,Video 禁止鼠标右键下载
175 0
|
1月前
|
存储 JSON JavaScript
如何使用 JavaScript 代码创建虚拟鼠标点击事件
如何使用 JavaScript 代码创建虚拟鼠标点击事件
18 0
|
6月前
|
JavaScript 前端开发 Windows
VScode的注释和标题,标签,img的src属性(如何网页上插入图片)(Mac如何开启js控制台)(如何免费复制网页中的文字)
VScode的注释和标题,标签,img的src属性(如何网页上插入图片)(Mac如何开启js控制台)(如何免费复制网页中的文字)
|
3月前
|
JavaScript
|
3月前
|
JavaScript 前端开发 数据安全/隐私保护
JS实现获取鼠标在画布中的位置
JS实现获取鼠标在画布中的位置
18 0
|
4月前
|
JavaScript
JS设置键盘快捷键、组合键
JS设置键盘快捷键、组合键
|
4月前
|
JavaScript
【经典】原生JS实现“用鼠标拖拽(drag)内容DIV”,滚动条对应同步滚动
【经典】原生JS实现“用鼠标拖拽(drag)内容DIV”,滚动条对应同步滚动