String in Link umwandeln

  • Hi zusammen,


    ich probiere mich zurzeit an einem QR Code Reader, der einen QR Code laden und auslesen kann. Vor allem sollen damit Qr Codes mit Links ausgelesen werden.


    Soweit funktionier das ganze auch, über klick auf Datei auswählen kann der QR Code geladen werden und die hinterlegte URL wird als String zurück gegeben und in dem Button dargestellt, allerdings ist der Button nicht klickbar.


    Daher meine Frage, wie kann ich anstatt eines Strings einen Link zurück geben bzw. wie kann ich den String so umwandeln, dass der button klickbar wird?


  • hast du da schon was online ? im codepen habe ich nur ein button mit datei auswählen und das wahrs .Was für eine datei muss man den da einlesen damit es klappt.

    Bei mir auf der Homepage habe ich auch sowas ,nur andersrum.

    Man gibt eine url ein und bekommt dann den qr code als Bild .

    sehe mein Profilbild,wenn du den scannst kommt man auf meiner page ,wenn das bild komplett wäre und nicht rund

  • Hi,


    man muss einfach eine Bild Datei (jpg oder png o.ä.) auswählen auf der der QR Code abgebildet ist.

    Der erste Entwurf ist schon online und kann hier mal getestet werden: http://johannes-penzel.de/qr-code

    Einfach auf Datei auswählen klicken und das Bild mit dem QR Code auswählen, dann sollte im Button der Link des QR Codes erscheinen.


    Und diesen Button möchte ich klickbar machen, damit auf den Link weitergeleitet wird.

  • Hi,


    ich habe jetzt nochmal einen neuen Reader integriert, mit dem der Code automatisch gescannt wird.

    Und habe jetzt wieder das selbe Problem, das das Ergebnis nur als Text ausgegeben wird und ich bekomme es nicht hin, das Ergebnis als Link klickbar zu machen.

    Es geht um diese Zeile, dass das Ergebnis "scan.content" klickbar gemacht wird.

    Code
    <li v-for="scan in scans" :key="scan.date" :title="scan.content"> {{ scan.content }}</li>

    Kannst du mir da bitte noch einmal helfen?


    Den Code und das Beispiel unter https://www.johannes-penzel.de/qr-code


    Vielen Dank schonmal

  • Was ist das den für ein Link da kann man ja nix anklicken nix hochladen .

    Wie ich sehe wird die Webcam geladen kann das sein ?

    Ich kann da leider nix helfen weil ich nix hochladen kann und auch keine Cam habe und nix dafür.


    Du hast da auch 3 Fremdscripte / Bibiliotheken drinne die ich nicht kenne bzw noch nicht mit gearbeitet habe.

    Einige solcher Scripte haben ihr eigenen programier stiel ( Ich meine so wie jquery ) und weiss deswegen auch nicht was an den Code richtig ist


    Code
    <li v-for="scan in scans" :key="scan.date" :title="scan.content"> {{ scan.content }}</li>
    
    oder  an den
    
    <a @click.stop="selectCamera(camera)">{{ formatName(camera.name) }}</a>


    So ein Code mit so @ Zeichen direkt im <a> kenne ich nicht ,

    Wie gesagt das gehöhrt bestimmt zu den Bibiliotheken die du eingebunden hast.


    Da sollte mal einer kucken der sich damit auskennt .

    Oder dein Link ist irgendwas falsch weil wie gesagt kann ja nix hochladen oder so -

    Im vorherigen Beispiel wahr das ja kein problem ,weil was ich Testen kann ,kann ich vieleicht auch beheben,aber so komme ich nicht weiter .


    Sorry

  • Sieht mir nach dem JS-Framework Vue.js aus, richtig?


    Ich fürchte, da kennt sich hier keiner mit aus.


    jope Wenn du selber keine Ahnung davon hast, lass das lieber bleiben. Arbeite erstmal mit purem JS oder zumindest mit jQuery.


    Davon abgesehen dürfte dein Problem allerdings sehr simpel sein. Du nutzt einen li-Tag, welcher selbstverständlich kein Link ist. Täusche ihn durch den a-Tag aus und es sollte funktionieren.


    Hier wird übrigens klar, dass es massiv an den Grundlagen bei dir scheitert. HTML und CSS sowie die Basics von JS sollte man auf jeden Fall drauf haben, bevor man sich an ein Framework wie Vue.js wagt.



    HTML
    <a v-for="scan in scans" :key="scan.date" :title="scan.content" href="{{ scan.content }}"> {{ scan.content }}</a>


    HTML
    <a v-for="scan in scans" :key="scan.date" :title="scan.content" :href="scan.content"> {{ scan.content }}</a>


    Wenn das Erste nicht funktioniert, mal das Zweite ausprobieren. Habe wie gesagt keine Ahnung von Vue.js. Kann also selbst nur Vermutungen aufstellen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!