Start · Sprachen · JavaScript · Referenz · HTMLFormElement.acceptCharset

HTMLFormElement.acceptCharset

Eigenschaft

Liest oder setzt das HTML-Attribut <code>accept-charset</code> eines <code>&lt;form&gt;</code>-Elements, also die Zeichenkodierung(en) für das Absenden der Formulardaten.

seit JavaScript Baseline: alle Browser Kategorie: webapi

Signatur

HTMLFormElement.acceptCharset

Beschreibung

Die Eigenschaft acceptCharset spiegelt das Inhaltsattribut accept-charset des <form>-Elements wider. Sie ist ein string und kann gelesen und geschrieben werden. Laut HTML-Standard enthält sie eine durch Leerzeichen getrennte Liste von Zeichenkodierungs-Bezeichnern. Der Browser verwendet die erste Kodierung aus der Liste, die er unterstützt, um die Formulardaten beim Absenden zu kodieren.

Ist das Attribut nicht gesetzt, liefert die Eigenschaft einen leeren String. Das Formular wird dann in der Zeichenkodierung des Dokuments abgeschickt, heute in der Regel UTF-8.

Seit der Überarbeitung des HTML-Standards ist als Wert nur noch UTF-8 zulässig (ohne Beachtung der Groß- und Kleinschreibung). In der Praxis braucht man die Eigenschaft daher selten. Nützlich ist sie vor allem, um die Kodierung ausdrücklich festzulegen, wenn ein Altsystem auf dem Server das verlangt, oder um bestehende Formulare zu prüfen und zu vereinheitlichen.

Rückgabewert

Typ
string
Beschreibung
Der Wert des Attributs accept-charset, genau so, wie er im Attribut steht. Ist das Attribut nicht vorhanden, ist der Wert ein leerer String "".

Beispiele

Kodierung eines Formulars auslesen

// HTML: <form id="kontakt" accept-charset="UTF-8" action="/senden"></form>
const form = document.getElementById('kontakt');
console.log(form.acceptCharset);

// Formular ohne Attribut
const leer = document.createElement('form');
console.log(JSON.stringify(leer.acceptCharset));
UTF-8 ""

Kodierung per Skript setzen (Attribut wird gespiegelt)

const form = document.createElement('form');
form.action = '/api/bestellung';
form.method = 'post';
form.acceptCharset = 'UTF-8';

console.log(form.getAttribute('accept-charset'));
console.log(form.outerHTML);
UTF-8 <form action="/api/bestellung" method="post" accept-charset="UTF-8"></form>

Alle Formulare einer Seite prüfen und auf UTF-8 vereinheitlichen

const pruefeFormulare = () => {
  const abweichend = [...document.forms].filter((form) => {
    const wert = form.acceptCharset.trim();
    return wert !== '' && wert.toLowerCase() !== 'utf-8';
  });

  abweichend.forEach((form) => {
    console.warn(`Formular "${form.id || form.name || '(ohne Namen)'}" nutzt: ${form.acceptCharset}`);
    form.acceptCharset = 'UTF-8';
  });

  return abweichend.length;
};

console.log(`${pruefeFormulare()} Formular(e) korrigiert`);
Formular "alt" nutzt: ISO-8859-1 1 Formular(e) korrigiert

// Wichtig · Fallstricke

  • Name: Die Eigenschaft heißt acceptCharset (Camel-Case). Das HTML-Attribut heißt dagegen accept-charset (mit Bindestrich). form.accept_charset oder form['accept-charset'] ergeben undefined.
  • Nur UTF-8 ist zulässig: Der aktuelle HTML-Standard erlaubt als Wert nur UTF-8. Ältere Werte wie ISO-8859-1 oder windows-1252 werden vom Browser zum Teil noch beachtet, gelten aber als nicht konform. Beim Validieren führen sie zu Warnungen.
  • Keine Prüfung beim Setzen: Die Eigenschaft übernimmt jeden beliebigen String unverändert ins Attribut. Ungültige Kodierungsnamen lösen keinen Fehler aus. Der Browser ignoriert sie erst beim Absenden und nimmt dann die Kodierung des Dokuments.
  • Kein Einfluss auf fetch/FormData: Schickst du die Daten per fetch() mit new FormData(form), spielt acceptCharset keine Rolle. Die Daten werden dann immer als UTF-8 kodiert.
  • Kompatibilität: Alle gängigen Browser unterstützen die Eigenschaft seit vielen Jahren.