Ich habe eine HTML-Seite mit einem bestimmten Eingabefeld und möchte folgende Funktionalität hinzufügen.
Der Benutzer sollte eine Ressource auf das Feld ziehen und ablegen können. Das Ergebnis dieser Aktion sollte sein, dass die URL der Ressource in dem Feld angezeigt wird.
Die Ressource könnte eine lokale Datei sein, die zu einer URL wie file:///home/me/document
oder file://c:\windows-files\document.doc
führt.
Die Ressource könnte auch eine Webressource sein, die zu einer URL wie http://host.nl/document.doc
oder sogar ftp://host.nl/document.doc
führt, obwohl ich an diesem Punkt nicht wirklich an FTP-Ressourcen interessiert bin. Ich gehe von einer dnd-Aktion einer Webseiten-URL aus der Adressleiste eines Webbrowsers oder einer dnd-Aktion einer Datei auf dem Client-Rechner aus z. der Desktop.
Wie für Web-Apps üblich, möchte ich, dass diese Funktionalität auf den meisten Plattformen funktioniert. (Linux / Win / MacOS, Firefox / Chrome / Safari / IE / Opera)
Das Paradigma ist HTML und JavaScript.
In Firefox können Sie file.mozFullPath verwenden. Diese Variable wird jedoch nur in Firefox angezeigt und funktioniert nicht in Chrome oder Safari.
Durch Sicherheitsmaßnahmen, die von allen modernen Browsern eingeführt werden, ist es unmöglich, den echten vollständigen Pfad einer Datei zu erhalten, die in einen Browser gezogen und abgelegt wurde.
Alle gängigen Browser ersetzen jetzt den Dateipfad durch "/ fakepath / 'FileName'" wobei 'FileName' der Name der ausgewählten Datei ist.
Sie können jedoch immer noch Drag-and-Drop-Funktionen ausführen und erhalten nur den Dateinamen der Datei, die Sie in den Browser gezogen haben.
Hier ist eine Modifikation der Antwort auf die verwandte Frage in den Kommentaren der Frage
Tags und Links javascript html url drag-and-drop