ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript で入力フィールドから値を取得するときに HTML エンコーディングの損失を防ぐにはどうすればよいですか?

JavaScript で入力フィールドから値を取得するときに HTML エンコーディングの損失を防ぐにはどうすればよいですか?

Patricia Arquette
リリース: 2024-12-30 15:11:08
オリジナル
317 人が閲覧しました

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

入力フィールド属性の取得における HTML エンコーディングの損失

JavaScript で、テキストボックスに表示する非表示フィールドの値を取得すると、エンコーディングの問題が発生する可能性があります。次の例を考えてみましょう:

<input>
ログイン後にコピー

jQuery を使用して非表示フィールドから値を取得すると、JavaScript はエンコーディングを失います:

$('#hiddenId').attr('value')
ログイン後にコピー

必要な出力は "チョーク & チーズ" です。リテラルの「&」は保持されます。

解決策

この問題に対処するために、次の方法を導入します。関数:

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

function htmlDecode(value) {
  return $('<textarea/>').html(value).text();
}
ログイン後にコピー

これらの関数は、メモリ内テキストエリア要素を作成し、その内部テキストを設定して、エンコードされたコンテンツ (htmlEncode) またはデコードされた内部テキスト (htmlDecode) を取得します。この要素は DOM 上に存在しません。

使用例

次のコードは、これらの関数の使用方法を示しています。

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"
ログイン後にコピー

これらの関数を利用することで、効果的に保守できます。 JavaScript で入力フィールドから値を取得するときの HTML エンコード。

以上がJavaScript で入力フィールドから値を取得するときに HTML エンコーディングの損失を防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート