onClick：在Facebook上分享圖片

Question

我想在我的新網站上啟動Facebook共享器的圖像上設置一個onClick功能。

以下是一些可能有助於理解我所說的內容的代碼

<div id="mImageBox">
<img id='my_image' src='' width="auto" height="auto"/>
</div>

圖像src是空白的，因為它是由另一個JavaScript函數通過使用“my_image”注入的

所以，我嘗試使用此方法設置onClick函數：

<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script>

<div id="mImageBox">
<a rel="nofollow" href="http://www.facebook.com/share.php?u=<;url>" onclick="return fbs_click()" target="_blank"><img id='my_image' src='' width="auto" height="auto"/></a>
</div>

onClick函數運行良好，但它鏈接到img所在的頁面而不是img本身！

你有什么建議嗎？

Answer 1

試試這個：

<div id="mImageBox">
<img id='my_image' src='' alt='' width="auto" height="auto" onclick="fbs_click(this)"/>
</div>

<script>
     function fbs_click(TheImg) {
     u=TheImg.src;
     // t=document.title;
    t=TheImg.getAttribute('alt');
    window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;
}
</script>

對於JS禁用的情況，您不需要使用<a>標簽（圍繞<img>標簽），因為在這種情況下，應該注入src屬性的JS也不會起作用。

Answer 2

只需調用以下功能，您就可以在Facebook上與您的鏈接和文本共享圖像。

function sharefbimage() {
    FB.init({ appId: `your appid`, status: true, cookie: true });
    FB.ui(
    {
        method: `share`,
        name: 'Facebook Dialogs',
        href: $(location).attr('href'),
        link: 'https://developers.facebook.com/docs/dialogs/',
        picture: 'your image url',
        caption: 'Ishelf Book',
        description: 'your description'
    },
    function (response) {
        if (response && response.post_id) {
            alert('success');
        } else {
            alert('error');
        }
    }
);

Answer 3

自從上周以來Facebook上的Javascript API 2.9已經死了，上面的解決方案不再適用了（我花了半天時間才找到它!!!）。 在v2.10中，FB.ui的圖片參數不再存在。 但我找到了一種解決方法，為每個圖像生成一個單獨的URL參數，因此Facebook必須單獨為每個共享圖像刮取Open Graph數據。 我在這篇文章中分享了我的代碼供您參考。