Ausgabevariable in einem href - Javascript

Ich benutze Magnific Popup für meine Galerie. Wenn Sie auf ein Miniaturbild klicken, wird das Bild eingeblendet. Ich versuche, eine Schaltfläche "Bild herunterladen" im Popup hinzuzufügen. Ich habe das HTML-Snippet, das fein anzeigt, aber die href des Downloadlinks muss mit der img URL gefüllt werden.Ausgabevariable in einem href - Javascript

Hier ist der JS-Code:

markup: '<div class="mfp-figure">'+ 
       '<div class="mfp-close"></div>'+ 
       '<div class="download-img"><a href="#">Download image</a></div>'+ 
       '<figure>'+ 
        '<div class="mfp-img"></div>'+ 
        '<figcaption>'+ 
         '<div class="mfp-bottom-bar">'+ 
          '<div class="mfp-title"></div>'+ 
          '<div class="mfp-counter"></div>'+ 
         '</div>'+ 
        '</figcaption>'+ 
       '</figure>'+ 
      '</div>',

Wie kann ich das Bild src Variable in der href Sanker?

Quelle

2016-05-05 Garrettj944

Wenn Sie das Magnific Popup API überprüfen Sie werden sehen, dass es einen Rückruf für die Veranstaltung markupParse

So fügen Sie diese zu Ihrer Magnific Popup Optionen

callbacks: { 
     markupParse: function(template, values, item) { 
     template.find('.download-img a').prop('href',item.src); 
     } 
    }

bietet Vollständige Demo bei http://codepen.io/gpetrioli/pen/reoqQv

Quelle

2016-05-05 20:52:21

* bearbeiten. Wo genau platziere ich es im Optionsbereich? – Garrettj944

Ich habe herausgefunden, wo der Callback-Code, aber es immer noch nicht die A href auf die Img URL – Garrettj944

@ Garrettj944 ist Ihre Seite irgendwo leben? –

Setzen Sie die Variable einfach aus Anführungszeichen.

markup: '<div class="mfp-figure">'+ 
       '<div class="mfp-close"></div>'+ 
       '<div class="download-img"><a href="' + yourVar + '">Download image</a></div>'+ 
       '<figure>'+ 
        '<div class="mfp-img"></div>'+ 
        '<figcaption>'+ 
         '<div class="mfp-bottom-bar">'+ 
          '<div class="mfp-title"></div>'+ 
          '<div class="mfp-counter"></div>'+ 
         '</div>'+ 
        '</figcaption>'+ 
       '</figure>'+ 
      '</div>',

Quelle

2016-05-05 20:17:54

Funktioniert nicht. Wenn Sie den Code sehen wollen, kann ich Ihnen – Garrettj944

Ich brauche kein Geld. Ich mache es aus Leidenschaft. Könnten Sie mir den gesamten Code oder zumindest das Stück zeigen, wo die Variable ist und den ganzen großen Popup-Aufruf? –

Alles klar, hier ist die Js-Datei für das Popup: http://pastebin.com/QcpRnjQS STRG + F "Download", um zu finden, wo mein HTML-Snippet ist. – Garrettj944

Der folgende Link zeigt Ihnen eine Reihe von Möglichkeiten, die Sie verwenden können href einige sind gut und andere sind schlecht. Werfen Sie einen Blick auf https://stackoverflow.com/a/11348403/886393

speziell die Antwort von Benutzername Demp.

Danke, Paras

Quelle

2016-05-05 20:21:45 pparas

Ich versuche, eine js-Variable zu echo, nicht eine Funktion ausführen, wenn sie klicken. Wenn Sie bereit sind, in den Code zu schauen, kann ich Ihnen – Garrettj944

zahlen den Code hier. Ich kann dir helfen und auch die Gemeinschaft. Ich mache das zum Üben. Ich möchte nicht bezahlt werden. – pparas

@Jakub untersucht es, Sie können auch, wenn Sie möchten. Siehe meinen Kommentar seine Antwort :) – Garrettj944

Ausgabevariable in einem href - Javascript

Antwort

Verwandte Themen