CSS und JQuery: Leerzeichen im Bildnamen break-code der url()
Ich eine Seite haben soll, zur Anzeige einer größeren version des Bildes, wenn Sie mit der Maus auf eine Miniaturansicht.
Habe ich ein " div " mit der ID und der JQuery-code ist wie folgt:
$(document).ready(function(){
$('img').hover(function() {
var src = $("#im" + this.id).attr("src");
$('#viewlarge').css('backgroundImage','url(' + src +')');
return false;
});
});
Die Bilder, die ich verwenden, generiert von einem Ruby-Skript, dass "erzeugen" ein Bild mit einem ähnlichen, aber mit unterschiedlichen id. Manchmal jedoch, Fotos werden hochgeladen, die "Räume" im Innern. Meine Entwickler-tools sagen mir, dass das background-image ist nicht richtig eingestellt, doch das Bild Pfad korrekt ist, und die browser haben keine Probleme mit dem Bild.
Meine Frage ist, kann ich das irgendwie bereinigen, die url 'src', also Leerzeichen kein problem sein? Ich bin mir bewusst, dies zu tun, server-Seite, doch ich würde gerne wissen, wie man dies mit JQuery/JS auch.
Dank!
InformationsquelleAutor Shyam | 2010-05-18
Du musst angemeldet sein, um einen Kommentar abzugeben.
Leerzeichen sind nicht gültig in URI. Sie müssen codiert werden, um
%20
.Könnte man
src.replace(//g, '%20')
oder generellencodeURI(src)
zu%
-codieren werden alle Zeichen, die nicht gültig in URI.encodeURIComponent(src)
ist häufiger, aber es würde nur funktionieren, wenn diesrc
war nur einer einzelnen relativen Dateinamen; ansonsten, es würde Kodieren/
- und stop-Pfade arbeiten.Jedoch die echtes problem ist, dass die original
img src
ist schon kaputt und funktioniert nur Dank browser-Korrekturen, Korrektur Ihrer Fehler. Sie müssen zum beheben des Ruby-Skripts generieren der Seite. Sie sollten die URL-Kodierung der Dateinamen, bevor es in den Pfad; es gibt viele weitere Zeichen, die Probleme verursachen kann, als einfach nur Platz.Als Pekka sagte, sollten Sie auch mit Anführungszeichen um die URL in die
url(...)
Wert. Während Sie Weg erhalten können, ohne Sie für viele URLs, einige Zeichen werden müsste\
-entkommen. Mit doppelten Anführungszeichen bedeuten, dass Sie vermeiden können, dass (keine doppelten Anführungszeichen, erscheinen in der URL selbst).encodeURI
undencodeURIComponent
Durcheinander in meiner Antwort.+1, Danke für die klare Erläuterung! Ich werde versuchen, diese.
Sie können schreiben, ein einfaches javascript-Beispiel, um dies zu demonstrieren?
InformationsquelleAutor bobince
Hinzufügen von Anführungszeichen um die URL sollte helfen:
jedoch nach der W3C-specs Leerzeichen müssen maskiert werden, so dass die URL-encoding-Lösung von
@Andy E s head@bobince ist die sicherste.Das ist falsch, +1 zu verrechnen.
+1 - ich wollte hinzufügen, um diesen Vorschlag zu meine Antwort, bis ich sah, Sie hatte es gepostet.
href="http://stackoverflow.com/questions/2168855/css-url-whats-better">stackoverflow.com/questions/2168855/css-url-whats-better Bitte Lesen Sie die Spezifikation vor der down-voting, Sie sind falsch: w3.org/TR/CSS2/syndata.html#value-def-uri
Ich bearbeitet meine Frage. Ich Stimme zwar, dass die URI, die letztlich die codiert werden müssen, als Andy E und bobince Punkt, aus.
InformationsquelleAutor Pekka 웃
cool, welche Seite ist es? ich werde das hochladen einer Datei mit einem fehlerhaften Namen und injiziert ein javascript in Ihre Seite ein und stehlen Ihre Benutzer-logins, takover eine Sitzung und entführen ein Konto, zerstören einige Daten und sonst Ihr Geschäft epic Schmerzen und Kosten. woo!
* ich nicht. aber jemand könnte!
Sie können einen Punkt machen, ohne sarkastisch zu werden. Ich entschuldige mich, ich war nicht geboren, mit einer 500lbs Sicherheits-Handbuch. Beachten Sie auch den letzten Satz meiner Frage. Ich danke Ihnen für die Hervorhebung der Frage der Sicherheit, ich bin ein bisschen weniger dankbar für die feindliche Antwort.
entschuldigt, ich wusste nicht, dass es in einer feindseligen Art und Weise, war es mir gemütlich 😉
InformationsquelleAutor Andrew Bullock
Javascript
encode
- Funktion für die Kodierung von 'src
'E. g.
Ich denke, man kann auch Javascript '
escape
" - Funktion auchencode
veraltet ist, wegen der fehlenden unicode-Unterstützung.encodeURI
undencodeURIComponent
empfohlen Ersatz.encodeURI, wie kann ich nutzen? Gleiche wie die encode () - Methode?
Es gibt keine solche Sache wie
encode
.escape
existiert, aber es ist die falsche Sache.Hab ich Total verpasst, und verwechselt die beiden.
escape
bearbeitet wurde im Nachhinein. jemand stellte den Kessel auf!InformationsquelleAutor Julius A
Ich würde nicht zulassen, dass Bilder mit Leerzeichen im Dateinamen hochgeladen werden - scheint nicht eine gute übung für mich.
InformationsquelleAutor matpol
Ich weiß, Sie haben bereits ausgewählt ist deine Antwort, aber ich möchte zu verbessern, Pekka Lösung und stellen die praktikabelste Lösung, da ich rannte in ein anderes problem während der Verarbeitung eine Datei mit Namen Klammern.
Ich hoffe, es hilft !
InformationsquelleAutor R.Cha