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');
        }
    }
);