Daten|teiler
Kopieren als Kulturtechnik

JavaScript in WordPress integrieren

3. April 2008 von Christian Imhorst

JavaScript eignet sich unter anderem besonders gut dazu, um Formularinhalte zu überprüfen. Wurde eine halbwegs plausible E-Mail-Adresse eingeben? Stehen in einem Feld, in dem nur Zahlen eingegeben werden sollen, wirklich nur Zahlen, oder auch Buchstaben? Der folgende kleine Code-Schnipsel JavaScript soll den Inhalt eines Formularfeldes daraufhin überprüfen, ob wirklich nur die Zeichen eingegeben wurden, die auch in das Feld gehören, nämlich 1, 2, 3, 4, 5, 6, 7, 8, 9 und 0.

function istZahl(Feld)
  {
  istZeichen(Feld, "0123456789", "Bitte nur Zahlen eingeben.")
  }
 
function istZeichen(Feld, istRichtig, istFehler)
  {
  for (var Pos = 0; Pos < Feld.value.length; Pos++)
    {
    if (istRichtig.indexOf(Feld.value.charAt(Pos)) == -1)
      {
      alert(istFehler)
      Feld.focus()
      return;
      }
    }
  }

JavaScript wird in WordPress-Postings aber nicht automatisch ausgeführt, da das Script nicht im HTML-Header der Seite steht. Jetzt könnte man zwar das Script in der Datei „header.php“ eintragen, dann wäre es aber auch in all den anderen Seiten im Weblog verfügbar, in denen man es vielleicht nicht haben möchte. Mit folgender Methode von Frank Bültge kann man den Code auch in Postings verwenden.
Als erstes muss das Script als Datei, z.B. „formularchecker.js“, abgespeichert werden. Mit der Upload-Funktion von WordPress kann man die Datei dann hochladen und in das Posting einfügen:

<script type="text/javascript" src="/Pfad/zu/formularchecker.js"></script>
<form>
   <input type="text" name="Zahlen" size="30" maxlength="30" 
     onblur="istZahl(this)" />
   <input type="reset" value="Check" />
</form>

Das fertige Produkt kann unten bewundert werden. Wenn man eine Zahl eingibt, wird der Inhalt des Formularfeldes zurückgesetzt. Bei allen anderen Zeichen erscheint eine Fehlermeldung.



Geschrieben in Haustechnik