Question

我正在制作一个书签，当您点击网页上的任何图像时，该书签会提供图像的完整路径。然后将图像下载到我们的服务器上，然后我们就可以开展业务了。

目前，脚本使用jQuery解析src属性，然后有一些通常可行的哑逻辑，但通常不会。

现在，我可以继续编写难看的代码来更好地使用正则表达式和东西来解析url，但我觉得应该有更好的方法来做这个...找到一些模仿的方法（如在firefox中））“右键单击=＆gt;复制图像位置”会很棒。

以下是我目前相关的js代码（错误，但它通常有效）..有关如何更好地实现这一点的任何创新想法？

var imgsrc;
$("img").click(function() {
  imgsrc = $(this).attr("src");
  var url = document.URL;

  if (window.location.pathname != "/") {
    var pathLoc = url.indexOf(window.location.pathname);
    url = url.substr(0, pathLoc + 1);
  } else if (window.location.pathname.substr(0,1) == "/") {
    url = url.substr(0, url.length - 1);
  }

  if (imgsrc.toLowerCase().indexOf("http://") != 0) {
    imgsrc = url + imgsrc;
  }

  window.open("http://www.mycompany.com/whatever?imgsrc=" + imgsrc + "");
});

$("img").hover(function () {
  $(this).css({'border' : '4px solid #ff0000'});
  }, function () {$(this).css({'border' : ''});
});

Answer 1

我相信大多数浏览器会对 SRC 属性进行规范化（我的意思是DOM属性，而不是 getAttribute('src') ）。所以你可以试试：

$("img").click(function() {
    window.open("http://www.mycompany.com/whatever?imgsrc=" + this.src + "");
});

如果这不起作用，那么我知道锚标签的 HREF 属性已标准化;这肯定会奏效：

$("img").click(function() {
    var fullSrc = $('<a/>').attr('href', this.src)[0].href;
    window.open("http://www.mycompany.com/whatever?imgsrc=" + fullSrc + "");
});

Answer 2

要在上下文菜单中添加菜单，您必须为firefox创建扩展名。我为维基百科here创建了一个扩展程序：您可能会对代码感兴趣。

bookmarklet获取图像的完整路径

2 个答案: