onClick: share-Bild auf Facebook

Ich würde gerne ein onClick-Funktion, um ein Bild auf meiner neuen website, starten Sie Facebook sharer.

Hier sind ein paar Stücke von code, kann helfen, zu verstehen, was ich Rede

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

Bild src ist leer, weil es gespritzt durch eine andere JavaScript-Funktion mit "my_image"

so, ich habe versucht, das setup der onClick-Funktion mit dieser Methode:

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

Die onClick-Funktion funktioniert gut, allerdings ist es links auf der Seite, wo das img liegt und nicht die img selbst!

Hast du einen Vorschlag für mich?

  • Es scheint die Funktion fbs_click() teilt die Seite. Beachten Sie, wie es verwendet u=location.href;. Ich denke, dass irgendwie, Sie haben zu ändern u auf die url des Bildes, statt auf der aktuellen Seite.
  • ich habe das auch gemerkt.. hast du eine Lösung ermittelt werden, die für die Bild-url aus dem img-id?
InformationsquelleAutor iGio90 | 2013-06-17
  1. 14

    versuchen Sie dies: 

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

    Müssen Sie nicht verwenden, <a> tag (rund um die <img> - tag) für den Fall, dass JS deaktiviert, weil in diesem Fall die JS das Einspritzen sollten die src Attribut wird nicht funktionieren auch.

    • Was passiert, wenn TheImg.src ist nicht eine vollständige url? z.B.: TheImg.src = "/assest/images/imageExample.jpg"
    • funktioniert! danke!!!
    • Es gibt die absolute URL. Aber im IE6 wird es wieder die relative URL. hier ist die Lösung für IE6: stackoverflow.com/questions/470832/...
    • ist es auch möglich, um das setup eine Taste, die das Bild?
    • Dani: was soll ich dort?
    • <input type="button" name="Antwort" value="Facebook" onclick="fbs_click(???)" />
    • das ist ein wenig komplizierter. geben Sie id, um das IMG-tag. und dann erkennen Sie die tag-ID. Beispiel: <img id="MyImg" src=""/><button onclick="fbs_click(document.getElementById('MyImg'))">hier klicken</button>
    • Dieser code funktioniert perfektioniert, aber jemand sagt mir, wie Sie einen Titel für das Bild. die schauen beim teilen auf facebook?

    InformationsquelleAutor Dani-Br
  2. 12

    Einfach anrufen unter-Funktion und teilen Sie Bild mit Ihrem Link und Text auf 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');
        }
    }
);
    • Danke!!! Ich habe auf der Suche seit etwa 2 Tagen und das ist die einzige, die Arbeiter richtig für mich. Ich musste nur noch hinzufügen , version : 'v2.5' in der init-Methode. Nochmals vielen Dank!
    • Ich verwendet den gleichen code und bekam den Fehler " Uncaught ReferenceError: FB ist nicht definiert. Was soll ich tun?
    • Müssen Sie zunächst Facebook JS SDK, um Ihre website. Siehe hier
    • es ist nicht in v2.8
    InformationsquelleAutor nativegrip
  3. 0

    Seit Facebooks Javascript-API 2.9 ist tot seit letzter Woche die Lösung oben funktioniert nicht mehr ( nahm ich mir einen halben Tag, um dies herauszufinden!!! ).
    In v2.10 das Bild-parameter von FB.ui gibt es nicht mehr.
    Aber ich fand einen workaround, die Erzeugung eines einzelnen URL-parameter für jedes Bild so Facebook hat zu kratzen Open-Graph-Daten für jedes geteilte Bild einzeln. Ich habe meine code in dieser Beitrag für Ihre Referenz.

    InformationsquelleAutor Hannes
Schreibe einen Kommentar