JS实现禁止鼠标右键的功能

遇到网页上有精美图片或者精彩文字想保存时，通常大家都是选中目标后按鼠标右键，在弹出菜单中选择“图片另存为”或“复制”来达到我们的目的。但是，目前有许多网页都屏蔽了鼠标右键，那么用js如何实现禁止鼠标右键的功能呢？

1.与禁止鼠标右键相关的JS说明

  1. <script type="text/javascript">
  2. document.oncontextmenu=new Function("event.returnValue=false;");
  3. document.onselectstart=new Function("event.returnValue=false;");
  4. </script>

2.禁止鼠标右键火狐失灵

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>禁止鼠标右键</title>
  5. <meta charset="utf-8">
  6. </head>
  7. <body>
  8. <div class="poo">这个页面不能使用鼠标右键</div>
  9. <!-- 禁止鼠标右键 -->
  10. <script type="text/javascript">
  11. if (window.Event){
  12. document.captureEvents(Event.MOUSEUP);
  13. }
  14. function nocontextmenu(){
  15. event.cancelBubble = true
  16. event.returnValue = false;
  17. return false;
  18. }
  19. function norightclick(e) {
  20. if (window.Event) {
  21. if (e.which == 2 || e.which == 3)
  22. return false;
  23. } else if (event.button == 2 || event.button == 3){
  24. event.cancelBubble = true
  25. event.returnValue = false;
  26. return false;
  27. }
  28. }
  29. document.oncontextmenu = nocontextmenu; // for IE5+
  30. document.onmousedown = norightclick; // for all others
  31. </script>
  32. </body>
  33. </html>

3.禁止选择文本

  1. <script type="text/javascript">
  2. var omitformtags=["input", "textarea", "select"];
  3. omitformtagsomitformtags=omitformtags.join("|");
  4. function disableselect(e){
  5. if (omitformtags.indexOf(e.target.tagName.toLowerCase())==-1){
  6. return false;
  7. }
  8. }
  9. function reEnable(){
  10. return true;
  11. }
  12. if (typeof document.onselectstart!="undefined"){
  13. document.onselectstart=new Function ("return false");
  14. }else{
  15. document.onmousedown=disableselect;
  16. document.onmouseup=reEnable;
  17. }
  18. </script>

4.屏蔽ctrl按键

  1. document.onkeydown=function(){
  2. if(event.ctrlKey)return false;
  3. }

以上所述是小编给大家介绍的JS实现禁止鼠标右键的功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言。

posted @ 2021-12-19 15:33  一亩地  阅读(2244)  评论(0)  编辑  收藏  举报