nicht angemeldet
HTML Tags automatisch im Textfeld
Mein Problem ist irgendwie schwerer zu beschreiben und ich habe mit der Suchfunktion nichts ähnliches gefunden:
Ich arbeite gerade an einem kleinem Autorensystem für unsere Webseite und habe ein kleines Problem: viele Schreiber unserer Webseite haben keine Ahnung von HTML o.ä. Nun will ich, das man im Textfeld eines Formulars einen Text tippen kann (bis jetzt ja noch kein Problem <g>), und dann den Text markieren kann, auf einem Button drückt und der Text dann vor und nach der Markierung ein HTML Tag hat ......
Ich habe ähnliches schon mal auf einer anderen Seite gesehen, aber weiß nicht mehr genau wo .....
Für jede Hilfe bin ich dankbar (oder andere Tipps)
MfG
Jörg
-
Hallo Jörg,
wo bitte soll der so formatierte Text aus dem Feld denn erscheinen? Nach dem Absenden des Formulares?
Dann frag den Inhalt dieses Textfeldes doch ab und mach ihn zu einer Variable, der Du dann mittels einer zweiten Abfrage -um die Art der Formatierung auszulesen- (oder eben einer Funktion, die durch das Klicken des Button gestartet wird) diese Formatierung zuweist und den so geänderten Text dann in ein verborgenes Feld oder aber in das selbe Feld zurückschreiben läßt.
Beispiel:
---------<script...>
function machFett()
{
text = document.beitrag.inhalt.value;
neu_text = "<b>" + text + "</b>";
document.beitrag.formatierter_text.value = neu_text;
}
</script><form name="beitrag" action="tuwas">
<input type="text" name="inhalt">
<input type="hidden" name="formatierter_text">
<input type="button" value="fettdruck" onClick="machFett()">
</form>Hier mußt Du sicherstellen, dass das Feld "inhalt" nicht ausgewertet wird, sonst kommt der Text zweimal; einmal mit und einmal ohne Format.
Beispiel 2:
-----------
(ohne verborgenes Feld)<script...>
function FettUndWeg()
{
text = document.beitrag.inhalt.value;
neu_text = "<b>" + text + "</b>";
document.beitrag.inhalt.value = neu_text;
document.beitrag.submit();
}
</script><form name="beitrag" action="tuwas">
<input type="text" name="inhalt">
<input type="button" value="fettdruck" onClick="FettUndWeg()">
</form>Ich hoffe, dass war, was Du haben wolltest. Wenn nicht... nochmal posten ;-)
Schönen Abend wünscht
der Alex-
Beispiel 2:
(ohne verborgenes Feld)
<script...>
function FettUndWeg()
{
text = document.beitrag.inhalt.value;
neu_text = "<b>" + text + "</b>";
document.beitrag.inhalt.value = neu_text;
document.beitrag.submit();
}
</script><form name="beitrag" action="tuwas">
<input type="text" name="inhalt">
<input type="button" value="fettdruck" onClick="FettUndWeg()">
</form>Ich hoffe, dass war, was Du haben wolltest. Wenn nicht... nochmal posten ;-)
Nabend und schon mal danke für die Hilfe! Im Grunde ist das 2. Bsp schon sehr nahe an dem, was ich will!! Er soll aber kein Submit nachdem Fettdruck machen (das habe ich shcon behoben), soll aber auch nur den markierten Text mit dem Tag versehen. Nach diesem Beispiel versieht er ja das ganze Textfeld mit dem HTML Tag.
Trotzdem schon mal Danke für die Hilfe!!
MfG
Jörg-
... soll aber auch nur den markierten Text mit dem Tag versehen. Nach diesem Beispiel versieht er ja das ganze Textfeld mit dem HTML Tag.
Hi Jörg,
dann wird es wohl nur einen Weg geben: Diesen markierten Text via JavaScript aus dem String herausnehmen, um die Format-Tags erweitern und an selber Stelle wieder einfügen, also im prinzip 3 Teilstrings erzeugen:
1. Vor dem markierten Text
2. den markierten Text
3. nach dem markierten TextDie große Preisfrage ist nun, ob es möglich ist, aus einem Formularfeldwert einen Textstring zu extrudieren, der markiert ist (nach diversen Kriterien kann man Strings ja splitten und extrahieren, nur ob es mit markiert geht? Keine Ahnung auf die Schnelle, sorry.)
Viel Erfolg & viele Grüße
Alex-
Hi Jörg,
dann wird es wohl nur einen Weg geben: Diesen markierten Text via JavaScript aus dem String herausnehmen, um die Format-Tags erweitern und an selber Stelle wieder einfügen, also im prinzip 3 Teilstrings erzeugen:
- Vor dem markierten Text
- den markierten Text
- nach dem markierten Text
Die große Preisfrage ist nun, ob es möglich ist, aus einem Formularfeldwert einen Textstring zu extrudieren, der markiert ist (nach diversen Kriterien kann man Strings ja splitten und extrahieren, nur ob es mit markiert geht? Keine Ahnung auf die Schnelle, sorry.)
Viel Erfolg & viele Grüße
AlexHi Alex,
eben genau das ist mein Problem: Kann man den mit der Maus markierten Bereich per JavaScript (oder sonst wie) erfassen. Da ich im Internet schon eine Lösung gesehen habe, muss das ja gehen. Gibt es vielleicht eine wirklich gute JavaScript Zusammenfassung (wie SelfHTML für HTML ist)? IM JS-Teil von SelftHTML finde ich leider keine Lösungen dazu ...
Da ich mittlerweile einige Mails bekommen habe (zu diesem Thema) werde ich eine Lösung sofort hier posten (falls keiner schneller als ich war <g>)
mfg
Jörg
-
-
-
-
Hi Jörg,
ich habe leider keine Lösung für Dein problem, sondern genau das selbe Problem.
Könnest Du mir (fallst DU eine Lösung findest) mir diese mitteilen?Gruß
Joern-
Hi Jörg,
ich habe leider keine Lösung für Dein problem, sondern genau das selbe Problem.
Könnest Du mir (fallst DU eine Lösung findest) mir diese mitteilen?Gruß
JoernHi,
werde ich natürlich machen, aber bislang sieht es düster aus. Bis auf den einen Vorschlag (siehe Posting) unten, kam noch nichts. Leider war er auch nicht zu 100% das passende. Ich habe das ganze schon mal auf einer anderen Webseite gesehen, weiß aber nicht mehr a) genau wo und b) welche Mittel genutzt wurden.
Aber noch bin ich guter Dinge <g>
MfG
Jörg
-
-
Hallo Jörg,
und dann den Text markieren kann, auf einem Button drückt und der Text dann vor und nach der Markierung ein HTML Tag hat ......
Für den IE habe ich eine Lösung gefunden, für den NN leider noch nicht. Wenns dir weiterhilft:
<script language="JavaScript">
<!--function ersetzen(sel,wert) {
var rg=sel;
rg.text='<'+wert+'>'+rg.text+'</'+wert+'>';
return
}//-->
</script><form name="a1" action="" method="" target="">
<input type="Button" name="" value="Fett" size="" maxlength="" onClick="ersetzen(selection.createRange(),'b')">
<input type="Button" name="" value="Kursiv" size="" maxlength="" onClick="ersetzen(selection.createRange(),'i')"><textarea name="a2" cols="40" rows="20" >Das heißt eine übersichtliche Gliederung, nicht mehr als 2 Schriftarten,
angemessene Schriftgröße und ein gezielter Einsatz von Farben,
Schriftstilen und Absatzformaten.
Bilden Sie kurze Sätze und sorgen Sie dafür, das ein Sinnzusammenhang immer deutlich wird.
Unterbrechen Sie den Textfluß durch Absätze.
Verwenden Sie Abkürzungen nur bei Bedeutungsklarheit.
Weiterführende Erläuterungen können und sollten bei Bedarf in
Fuß- und Endnoten oder Anhänge aufgenommen und ausgegliedert werden.</textarea></form>
Wichtig die Buttons _müssen_ sich im Formular befinden.
Viele Grüße
Antje
-
schnipp ---- schnappp ---- schnipp
gute Lösung entfernt
schnipp ---- schnappp ---- schnipp
Argh ... wie soll ich es sagen? Das ist es! Wie kann ich Dir nur danken? Ich will dich heiraten .... naja so weit gehe ich doch nicht <g>.
Trotzdem DANKE!!!!
MfG
Jörg-
Hallo Jörg
Argh ... wie soll ich es sagen? Das ist es! Wie kann ich Dir nur danken? Ich will dich heiraten .... naja so weit gehe ich doch nicht <g>.
<fg> Gott sei Dank, Bigamie wird in Deutschland bestraft ;-)
mittlerweile kann ich auch ein workaround für den NN gefunden. Der besitzt unter windows einen Bug, und interpretiert den event-Handler onselect nicht.
Prinzip: mit Verlassen des Formularfeldes wird der Inhalt in einen Layer geschrieben, dort selektiert und dann ersetzt. Allerdings läuft diese Lösung nicht ganz sauber. Bei Verschachtelungen gibt es Probleme, die zwar zu umgehen sind, aber die Mühe habe ich mir jetzt nicht gemacht. Schaffst du sicher selbst.
<html>
<head>
<title></title>
<meta name="author" content="Antje Hofmann">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<script language="JavaScript">
<!--
if (document.all) aw="selection.createRange()"; else aw="document.getSelection()";
function ersetzen(sel,wert) {
if (document.all)
{
sel.text='<'+wert+'>'+sel.text+'</'+wert+'>';}else
if (document.layers)
{wert="<"+wert+">"+sel+"</"+wert+">";
var text=document.a1.a2.value;
document.a1.a2.value=text.replace(sel,wert);;
nnersetzen(document.a1.a2.value)
}return
}
function nnersetzen(a)
{
if (document.layers)
{ document.a3.document.open();
document.a3.document.write(a);
document.a3.document.close();}
}
//-->
</script>
<form name="a1" action="" method="" target="">
<input type="Button" name="" value="Fett" size="" maxlength="" onClick="ersetzen(eval(aw),'b')">
<input type="Button" name="" value="Kursiv" size="" maxlength="" onClick="ersetzen(eval(aw),'i')"><br>
<textarea name="a2" cols="40" rows="20" onblur="nnersetzen(this.value)">Das heißt eine übersichtliche Gliederung, nicht mehr als 2 Schriftarten,
angemessene Schriftgröße und ein gezielter Einsatz von Farben,
Schriftstilen und Absatzformaten.
Bilden Sie kurze Sätze und sorgen Sie dafür, das ein Sinnzusammenhang immer deutlich wird.
Unterbrechen Sie den Textfluß durch Absätze.
Verwenden Sie Abkürzungen nur bei Bedeutungsklarheit.
Weiterführende Erläuterungen können und sollten bei Bedarf in
Fuß- und Endnoten oder Anhänge aufgenommen und ausgegliedert werden.</textarea></form>
<layer name="a3" top="20" left="450"></layer>
</body>
</html>Viele Grüße
Antje
-
Hi,
hat mir geholfen. Läuft jetzt auf NS und IE recht gut (IE besser) .... danke für die Hilfe! (auch wenn das nichts mehr mit der Heirat wirg <g>)
MfG
Jörg
-
-
-