Stellen Sie den Text in einer Spanne ein

72

Ich habe diese Spanne

<a title="Prev" data-event="click" 
   data-handler="prev" class="ui-datepicker-prev   ui-corner-all">
     <span class="ui-icon ui-icon-circle-triangle-w">Prev</span>
</a>

Ich muss den Text der Spanne so einstellen, dass er <<anstelle des aktuellen Textes ist Prev.

Ich habe es unten versucht, aber es hat den Text nicht wie erwartet geändert. Wie kann das gemacht werden?

 $(".ui-icon .ui-icon-circle-triangle-w").html('<<');
Ayman Hussein
quelle
Ich denke, es wird nicht funktionieren, weil Sie ASCII-Code für das übergeben müssen, was & laquo; Probieren Sie es aus, ich denke, es wird funktionieren.
Dipesh Parmar
Mögliches Duplikat, wie ein Wert für eine Spanne mit JQuery
Stewart am

Antworten:

141

Verwenden Sie .text()stattdessen und ändern Sie Ihren Selektor:

$(".ui-datepicker-prev .ui-icon.ui-icon-circle-triangle-w").text('<<');

- DEMO ANZEIGEN -

Curt
quelle
13

Dies liegt daran, dass Sie einen falschen Selektor haben. Entsprechend Ihrem Markup .ui-iconund .ui-icon-circle-triangle-w"sollte auf das gleiche <span>Element verweisen . Sie sollten also Folgendes verwenden:

$(".ui-icon.ui-icon-circle-triangle-w").html("<<");

oder

$(".ui-datepicker-prev .ui-icon").html("<<");

oder

$(".ui-datepicker-prev span").html("<<");
Vision
quelle
hmmm .. glaube nicht, dass dies funktionieren wird, weil es versuchen wird, das <<als HTML zu interpretieren , nein?
Musefan
1
@musefan Nein. Es wird funktionieren. Die text()Methode ist nicht erforderlich .
VisioN
1
@VisioN Dies liegt nur daran, dass es in diesem Fall nicht als HTML analysiert wird. Ich denke, wenn wir uns mit Textinhalten beschäftigen, textsollte verwendet werden. Was wäre, wenn der Benutzer <prev>angezeigt werden wollte , dann würde dies als HTML interpretiert
Curt
@Curt <prev>hat eine schließende >Klammer, daher macht der Browser ein Tag daraus. Andernfalls <<oder >>wird es richtig interpretiert.
VisioN
@VisioN Warum html()statt text()? Ich sehe keinen Vorteil, nur einen möglichen Fehler. OP ändert den Inhalt zu <prev>einem späteren Zeitpunkt. Jetzt müssen sie die Methode ändern, mit der die Zeichenfolge ausgegeben wird. Warum wurde überhaupt nicht die richtige Methode angewendet?
Curt
5

Sie müssen Ihren Selektor reparieren. Obwohl für die CSS-Syntax mehrere Klassen durch Leerzeichen getrennt werden müssen, müssen sie für die Selektorsyntax direkt verkettet und mit einem Punkt vorangestellt werden:

$(".ui-icon.ui-icon-circle-triangle-w").text(...);

oder besser:

$(".ui-datepicker-prev > span").text(...);
Alnitak
quelle
4
$('.ui-icon-circle-triangle-w').text('<<');
Anton
quelle
2

Geben Sie Ihrer Spanne eine ID und ändern Sie dann den Text der Zielspanne.

$("#StatusTitle").text("Info");
$("#StatusTitleIcon").removeClass("fa-exclamation").addClass("fa-info-circle"); 

<i id="StatusTitleIcon" class="fa fa-exclamation fa-fw"></i>
<span id="StatusTitle">Error</span>

Hier wird "Fehler" -Text zu "Info" und ihre fontawesome Symbole werden ebenfalls geändert.

Freier Wille
quelle
2

Probieren Sie es aus. Zuerst wird nach Anker-Tags gesucht, die span mit der Klasse "ui-icon-circle-triangle-w" enthalten. Anschließend wird der Text von span auf "<<" gesetzt.

$('a span.ui-icon-circle-triangle-w').text('<<');
Aamir
quelle
Fügen Sie eine Erklärung mit Antwort hinzu, wie diese Antwort OP bei der Behebung des aktuellen Problems
hilft
Ja sicher ... es wird zuerst nach Anker-Tags gesucht, die span mit der Klasse "ui-icon-circle-triangle-w" enthalten, und dann den Text von span auf "<<" setzen. Ich hoffe du verstehst jetzt ... :)
Aamir
Ja, bearbeiten Sie dies in Antwort, wodurch Ihre Antwort hilfreicher wird, da das Posten eines Code-Snippets nicht der richtige Weg ist, um eine Frage zu beantworten.
Danke