JavaScripts > Text > Script-Detail: Text zu Formularen hinzufügen

Text zu Formularen hinzufügen

Bei vielen Formularen, wie sie in manchen Gästebüchern oder Foren vorkommen, kann man per Klick auf einen Button/Link/Bild einen Text oder BBCode hinzufügen. In diesem Tutorial erkläre ich mal, wie das geht.

In den <head>-Bereich der Datei, in der das Formular ist, fügt man diesen Code hinzu:

Code:

Zur Erläuterung:
formularname: Hier spricht man das Formular an, das den Namen formularname hat. Der HTML-Code hieße da: <form action="action.php" name="formularname" ... >
textfeldname: Hier spricht man das Textfeld oder das Eingabefeld mit dem Namen textfeldname an. Der HTML-Code müsste <input name="textfeldname" type="text" ... > oder <textarea name="textfeldname" cols="..." rows=".."></textarea> heißen. Das Eingabe- oder Textfeld muss in dem benannten Formular liegen!

Dann kann man mit einem Link oder einem Button die Funktion aufrufen.
Dabei nimmt man als Linkziel javascript:text('der einzufügende Text').
Der Link wird wird <a href=""> oder onClick="" aufgerufen.

Code:

<a href="javascript:text('[B]fett[ /B]')">fett</a>
<button onClick="javascript:text('[I]kursiv[ /I]')" style="background-color:red; font-style:italic;">K</button>
<img onClick="javascript:text(' :D ')" src="smilies/icon_big.gif" alt="Smilie/Emoticon">

Und hier noch schnell eine ganze Seite:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Formular mit BBCodes</title>
<script language="JavaScript" type="text/javascript">

</script>
</head>
<body>
<h1>Formular mit BBCodes</h1>
<form name="formularname" action="action.php" method="post">
<textarea name="textfeldname" cols="50" rows="3"></textarea>

<button type="submit">Ab damit!</button>
<button type="reset">Nööö!</button>
</form>
<a href="javascript:text('[B]fett[ /B]')">fett</a>
<button onClick="javascript:text('[I]kursiv[ /I]')" style="background-color:red; font-style:italic;">K</button>
<img onClick="javascript:text(' :D ')" src="smilies/icon_big.gif" alt="Smilie/Emoticon">
</body>
</html>

Geschrieben von dasepp am 18.06.2004 (4869x gelesen)

weiterempfehlen

Druckversion

kommentieren

nettes Script, jetzt weiß ich endlich auch mal wie man das macht *gg*

Geschrieben von michi

echt super, funktioniert aber leider nicht unter Windows XP

Geschrieben von diluculum

Wie kommst du denn auf die Idee?

Geschrieben von Phil Marx

klappt auch unter xp super.

Geschrieben von steven