Formular mit HTML Tags

SwingerLive

Mitglied
Hallo,

kennt jemand ein fertiges Script für ein Formularfeld (Textarea) das es dem
User ermöglicht HTML Tags per Klick einzugeben?

Also so wie hier bei dem Forum B, I, U, usw


Gruß

Andreas
 
hallo

habe mal eine Frage bezüglich der bb codes , und zwar ich habe ein kleines java Chat System wo user ihre eigene Nickpage haben mit einem Gästebuch und habe das da oben eben ausprobiert aber es geht nicht er zeigt immer nur
[ b ] test [ / b ] an (habs jetzt nur so auseinander geschrieben) woran liegt das? gibt es evtl ein script das automatisch die bb codes umwandelt?


mfg DasLicht
 
Da bist du hier falsch.
Das macht man nämlich serverseitig.

Such mal im enstprechenden Forum (PHP, Perpl, usw.), das sollte da öfters gefragt werden.
Wird mit einem einfachen Regex gemacht.
 
hm das Gästebuch besteht aber nur aus einer html Datei nicht php.
Oder meinste das ich das ins system programmieren soll?
 
Hallo,

ich habe nun den Script von Crono genommen, und etwas umgearbeitet.
Was mir allerdings noch fehlt ist dass bei einem Pulldown-Menu der entsprechende HTML Code übernommen wird. Es fehlt der Javascript Aufruf von dem Pulldownmenü. Kann mir da jemand weiterhelfen?

Das Lauffähige Script kann bei folgendem Link angesehen werden.

hier der veränderte Quellcode von Crono

Code:
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--
function edit(mode){
switch(mode){
   case "fett":
        txt = prompt("Bitte geben Sie den fetten Text ein","");
        document.edit.text.value += "<b>"+txt+"</b>";
			  document.edit.text.focus();
	      break; 
	 case "kursiv":
	      txt = prompt("Bitte geben Sie den kursiven Text ein","");
        document.edit.text.value += "<i>"+txt+"</i>";
 			  document.edit.text.focus();
        break;
 case "under":
	      txt = prompt("Bitte geben Sie den unterstrichenen Text ein","");
        document.edit.text.value += "<u>"+txt+"</u>";
 			  document.edit.text.focus();
        break;
 case "bull":
	      txt = prompt("Bitte geben Sie Ihren Text ein","");
        document.edit.text.value += "<ul><li>"+txt+"</li></ul>";
 			  document.edit.text.focus();
        break;
case "num":
	      txt = prompt("Bitte geben Sie Ihren Text ein","");
        document.edit.text.value += "<ol><li>"+txt+"</li></ol>";
 			  document.edit.text.focus();
        break;
	 case "zeilenumbruch":
	      txt = prompt("Bitte klicken Sie rechts auf Ok","");
        document.edit.text.value += "<br>"+txt+"</br>";
 			  document.edit.text.focus();
        break;
 case "absatz":
	      txt = prompt("Bitte klicken Sie rechts auf Ok","");
        document.edit.text.value += "<p>"+txt+"</p>";
 			  document.edit.text.focus();
        break;
case "hr":
	      txt = prompt("Bitte gebe Sie in Prozent ein, wie breit die horizontale Linie sein soll","");
        document.edit.text.value += "<hr width="+txt+">";
 			  document.edit.text.focus();
        break;
   }
}


</script>

</head>

<? 
if ($Vorschau)
{
?>

<table width="580"  border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td bgcolor="#000000"><table width="100%"  border="0" cellspacing="1" cellpadding="5">
      <tr>
        <td bgcolor="#efefef"><? echo $text;?></td>
      </tr>
     
    </table></td>
  </tr>
</table>

<?
}
 
if ($senden)
{
	?>
<table width="580"  border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td bgcolor="#000000"><table width="100%"  border="0" cellspacing="1" cellpadding="5">
      <tr>
        <td bgcolor="#efefef">Daten wurden gespeichert</td>
      </tr>
     
    </table></td>
  </tr>
</table>
<?
	exit;
}
?>

<body>

<form action="" name="edit">
<table width="580" border="0" cellpadding="0" cellspacing="0">
<tr>
    <td colspan="6"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td bgcolor="#000000"><table width="100%"  border="0" cellspacing="1" cellpadding="0">
          <tr>
            <td colspan="10" bgcolor="#FFFFFF">Wenn Sie Ihren Text formatieren m&ouml;chten, dann klicken Sie 
              bitte vor dem Schreiben auf das entsprechende nachfolgende Symbol </td>
            </tr>
          <tr>
            <td colspan="10" bgcolor="#FFFFFF">&nbsp;</td>
            </tr>
          <tr>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('fett');"><img src="bilder/bold.gif" alt="Fettschrift" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('kursiv');"><img src="bilder/italic.gif" alt="Kursive Schrift" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('under');"><img src="bilder/under.gif" alt="Unterstrichener Text" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('bull');"><img src="bilder/bullist.gif" alt="Aufzählungszeichen" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('num');"><img src="bilder/numlist.gif" alt="Numerierte Aufzählungszeichen" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('zeilenumbruch');"><img src="bilder/br.gif" alt="Erzwungener Zeilenumbruch" width="23" height="22" border="0"></a></td>
            <td width="5%" bgcolor="#FFFFFF"><a href="javascript:edit('absatz');"><img src="bilder/p.gif" alt="Absatz" width="23" height="22" border="0"></a></td>
            <td width="6%" bgcolor="#FFFFFF"><a href="javascript:edit('hr');"><img src="bilder/hr.gif" alt="Horizontale Linie" width="23" height="22" border="0"></a></td>
            <td width="59%" bgcolor="#FFFFFF">
              <select name="farbe">
                <option style="color:black; background-color: #FFFFFF " value="#444444">Standard</option>
                <option style="color:darkred; background-color: #DEE3E7" value="darkred">Dunkelrot</option>
                <option style="color:red; background-color: #DEE3E7" value="red" >Rot</option>
                <option style="color:orange; background-color: #DEE3E7" value="orange">Orange</option>
                <option style="color:brown; background-color: #DEE3E7" value="brown">Braun</option>
                <option style="color:yellow; background-color: #DEE3E7" value="yellow">Gelb</option>
                <option style="color:green; background-color: #DEE3E7" value="green">Grün</option>
                <option style="color:olive; background-color: #DEE3E7" value="olive">Oliv</option>
                <option style="color:cyan; background-color: #DEE3E7" value="cyan">Cyan</option>
                <option style="color:blue; background-color: #DEE3E7" value="blue">Blau</option>
                <option style="color:darkblue; background-color: #DEE3E7" value="darkblue">Dunkelblau</option>
                <option style="color:indigo; background-color: #DEE3E7" value="indigo">Indigo</option>
                <option style="color:violet; background-color: #DEE3E7" value="violet">Violett</option>
                <option style="color:white; background-color: #DEE3E7" value="white">Weiß</option>
                <option style="color:black; background-color: #DEE3E7" value="black">Schwarz</option>
              </select>
         
</td>


          </tr>
        </table></td>
      </tr>
    </table></td>
    </tr>  
<tr>
    <td colspan="6"><textarea rows="30" cols="70" name="text"><? echo $text;?></textarea></td>
</tr>
  <tr>
    <td width="580"><input name="Vorschau" type="submit" id="Vorschau" value="Vorschau">
      &nbsp;
      <input name="senden" type="submit" id="senden" value="Senden"></td>
    <td width="4" colspan="4">&nbsp;</td>
    </tr>
</table>
</form>
</body>
</html>
 

Neue Beiträge

Zurück