bookmarklet獲取圖像的完整路徑

Question

我正在研究一個bookmarklet，當您單擊網頁上的任何圖像時，該圖標會給出圖像的完整路徑。然後將圖像下載到我們的服務器上，我們會爲其製作商業內容。

目前，該腳本使用jQuery解析出src屬性，然後有一些愚蠢的邏輯通常起作用，但通常不起作用。

現在，我可以不斷寫出醜陋的代碼，以更好地使用正則表達式和東西解析出url，但我覺得應該有一些更好的方法來做到這一點..尋找某種方式來模仿（如在火狐）「右鍵點擊=>複製圖像位置」將是太棒了。

這裏是我目前擁有的相關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：您可能會對代碼感興趣。