Heim >Web-Frontend >js-Tutorial >Wie kann ich den Verlust der HTML-Codierung beim Abrufen von Werten aus Eingabefeldern in JavaScript verhindern?

Wie kann ich den Verlust der HTML-Codierung beim Abrufen von Werten aus Eingabefeldern in JavaScript verhindern?

Patricia Arquette
Patricia ArquetteOriginal
2024-12-30 15:11:08330Durchsuche

How Can I Prevent HTML Encoding Loss When Retrieving Values from Input Fields in JavaScript?

HTML-Codierungsverlust beim Abrufen von Eingabefeldattributen

In JavaScript kann das Abrufen des Werts eines ausgeblendeten Felds zur Anzeige in einem Textfeld ein Codierungsproblem darstellen. Betrachten Sie das folgende Beispiel:

<input>

Wenn Sie jQuery verwenden, um den Wert aus dem versteckten Feld abzurufen, verliert JavaScript seine Kodierung:

$('#hiddenId').attr('value')

Die gewünschte Ausgabe ist „chalk & Cheese“ mit das wörtliche „&“ bleibt erhalten.

Lösung

Um dieses Problem zu beheben, stellen wir Folgendes vor Funktionen:

function htmlEncode(value) {
  return $('<textarea/>').text(value).html();
}

function htmlDecode(value) {
  return $('<textarea/>').html(value).text();
}

Diese Funktionen erstellen ein speicherinternes Textarea-Element, legen seinen inneren Text fest und rufen dann den kodierten Inhalt (htmlEncode) oder den dekodierten inneren Text (htmlDecode) ab. Das Element existiert nie im DOM.

Beispielverwendung

Der folgende Code zeigt, wie diese Funktionen verwendet werden:

let encodedValue = htmlEncode('chalk &amp; cheese');
console.log(encodedValue); // Outputs "chalk &amp;amp; cheese"

let decodedValue = htmlDecode(encodedValue);
console.log(decodedValue); // Outputs "chalk &amp; cheese"

Durch die Verwendung dieser Funktionen können Sie effektiv warten HTML-Codierung beim Abrufen von Werten aus Eingabefeldern in JavaScript.

Das obige ist der detaillierte Inhalt vonWie kann ich den Verlust der HTML-Codierung beim Abrufen von Werten aus Eingabefeldern in JavaScript verhindern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn