如何禁用右键单击以在 JavaScript 中下载图像

How do I disable right click to download images in JavaScript?

本文关键字:JavaScript 下载 图像 何禁用 右键 单击      更新时间:2023-09-26

预期行为为:

  • 当用户右键单击"仅图像"时,将显示版权声明。
  • 如果用户选择禁止显示来自网页的警报消息,则仍然不会显示用于保存图像的上下文菜单。
  • 适用于"所有"Web浏览器(包括IE 8+,Opera,Google Chrome,Apple Safari和Mozilla Firefox)。
  • 我希望能够将此代码放在自己的".js"文件中,名称为 image_norightclick.js .

法典:

var message="Copyright 'u00A9 2015 [YOUR NAME HERE]";
function disableClick(e) {
  if (document.all) {
    if (((event.button == 2) || (event.button == 3)) && ((event.srcElement.tagName == "IMG") || (event.srcElement.getAttribute("type").toUpperCase() == "IMAGE"))) {
      if (event.srcElement.oncontextmenu) {
        event.srcElement.oncontextmenu = function(event) {
          if (event.preventDefault) {
            event.preventDefault();
          };
          if (event.stopPropagation) {
            event.stopPropagation();
          };
          if (event.returnValue) {
            event.returnValue = false;
          };
        };
      } else {
        if (event.srcElement.addEventListener) {
          event.srcElement.addEventListener("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }
          );
        } else if (event.srcElement.attachEvent) {
          event.srcElement.attachEvent("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }
          );
        };
      };
      alert(message);
      return false;
    };
  } else if (document.layers) {
    if ((e.which == 2) || (e.which == 3)) {
      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {
        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }
          );
        };

      };

      alert(message);
      return false;
    };
  } else if (document.getElementById)
  {
    if (((e.which == 2) || (e.which == 3)) && ((e.target.tagName == "IMG") || (e.target.getAttribute("type") && e.target.getAttribute("type").toUpperCase() == "IMAGE"))) {

      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {
        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }
          );
        };

      };

      alert(message);
      return false;
    };
  };
};
function associateImages() {
  for (i = 0; i < document.images.length; i++) {
    document.images[i].onmousedown = disableClick;
  };
};
if (document.all) {
  if (document.onmouseup) {
    document.onmouseup = disableClick;
  } else {
    window.onmouseup = disableClick;
  };
} else if (document.getElementById) {
  if (document.onmousedown) {
    document.onmousedown = disableClick;
  } else {
    window.onmousedown = disableClick;
  };
} else if (document.layers) {
  associateImages();
};

new Function(){}怎么了?它只需要function(){}

.

您需要在顶部定义您的var message

var message = 'Your message here.';

这是工作代码:

function disableClick(e) {
  var message = 'WOULD YOU STEAL A CAR?';
  if (document.all) {
    if (((event.button == 2) || (event.button == 3)) && ((event.srcElement.tagName == "IMG") || (event.srcElement.getAttribute("type").toUpperCase() == "IMAGE"))) {
      if (event.srcElement.oncontextmenu) {
        event.srcElement.oncontextmenu = function(event) {
          if (event.preventDefault) {
            event.preventDefault();
          };
          if (event.stopPropagation) {
            event.stopPropagation();
          };
          if (event.returnValue) {
            event.returnValue = false;
          };
        };
      } else {
        if (event.srcElement.addEventListener) {
          event.srcElement.addEventListener("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }
          );
        } else if (event.srcElement.attachEvent) {
          event.srcElement.attachEvent("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }
          );
        };
      };
      alert(message);
      return false;
    };
  } else if (document.layers)
  {
    if ((e.which == 2) || (e.which == 3)) {
      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {
        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }
          );
        };

      };

      alert(message);
      return false;
    };
  } else if (document.getElementById)
  {
    if (((e.which == 2) || (e.which == 3)) && ((e.target.tagName == "IMG") || (e.target.getAttribute("type") && e.target.getAttribute("type").toUpperCase() == "IMAGE"))) {
      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {
        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }
          );
        };

      };

      alert(message);
      return false;
    };
  };
};
function associateImages() {
  for (i = 0; i < document.images.length; i++) {
    document.images[i].onmousedown = disableClick;
  };
};
if (document.all) {
  if (document.onmouseup) {
    document.onmouseup = disableClick;
  } else {
    window.onmouseup = disableClick;
  };
} else if (document.getElementById) {
  if (document.onmousedown) {
    document.onmousedown = disableClick;
  } else {
    window.onmousedown = disableClick;
  };
} else if (document.layers) {
  associateImages();
};
/* This is the actual "No Right-Click on Images" script [ABOVE]. DO NOT EDIT [ABOVE] THIS LINE [END] */

JS小提琴演示