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

时间:2015-03-11 00:05:21

标签: javascript

预期的行为是:

  • 当用户右键单击"仅图像"显示版权声明。
  • 如果用户选择禁止来自网页的警报消息,则不会显示保存图像的上下文菜单。
  • 适用于所有" ALL" 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();
};

1 个答案:

答案 0 :(得分:3)

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 Fiddle Demo