kostenloser Webspace werbefrei: lima-city

Text in ein textarea hinter dem Curser einfügen

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   achterbahn

   achterbahn hat kostenlosen Webspace.

   17:48, 25.5.2009

   Hallo ich hab zwei kleine Probleme:
   Ich hab für mein Browsergame ein NAchrichten system programmiert , wo man auch smilies benutzen kann(diese werden per javascript in das Texterea eingefügt).
   Dort hab ich nun 2 probleme:
   1. Weiß ich nicht wie ich es hinbekomme , das der Smilie im Textarea feld gleich als bild angezeigt wird.
   2. weiß ich nicht wie ich es hinbekomme , das der Smilie gleich dort eingefügt wird wo der Corser steht.
   Kann mir einer von euch dabei helfen?

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. t****o

   17:57, 25.5.2009

   <input type="button" value="Einfügen" onclick="document.homepage.text.value += ('text', 'hallo');">

   
   
   Bei value="" eintragen, was auf dem Button stehen soll.
   'text' : text musst du mit dem Namen deines Textareas ersetzen.
   'hallo' : hallo musst du durch das ersetzen, was eingefügt werden soll.
   
   telelo
   
   Nachtrag: Du kannst auch einen Link daraus machen:
   

   <a href="#" onclick="document.homepage.text.value += ('text', 'hallo');">Einfügen

   
   
   Beitrag zuletzt geändert: 25.5.2009 17:59:31 von telelo

4. ichbinlooper

   ichbinlooper hat kostenlosen Webspace.

   18:08, 25.5.2009

   Also Bilder direkt einfügen geht meines Wissens garnich...
   
   
   Ich glaube, das Beispiel fügt nur am Ende ein?

5. t****o

   18:21, 25.5.2009

   Er will ja einen Smily einfügen wenn er dann einfach :-) einfügt und das ganze dann später mit PHP gegen <img src="smily_lachen.gif"> ersetzt ist doch alles paletti
   
   telelo
   
6. Autor dieses Themas

   achterbahn

   achterbahn hat kostenlosen Webspace.

   19:39, 25.5.2009

   Das einfügen bekomm ich aj hin nur das er nicht am ende einfügt sondern dort wo man gerade am Text schreibt. Sprich man geht nachher nochmal den Text durch und will noch irgentwo einen smilie setzen, dann muss man momentan den smiliecode nochmal kopieren und an der gewünchten stelle einfügen. Ich hätte es aber gerne da ser gleich dort ist wo man ihn haben will/ der corser(das blinkende dingens da ) ist.
   Wenn das bildereinfügen nicht geht ist es nicht so schlimm. Ist eben nur schade, das anderre ist mir wichtiger.

7. ryanblack

   

   ryanblack hat kostenlosen Webspace.

   21:16, 25.5.2009

   Schau dir doch einfach den dazugehörigen Code von lima-city an (leicht verändert):

   function insertToTextareaWhereTheCursorIs(el, before, after) {
   	var text = before + after;
   
   	myField = document.getElementById(el);
   	if (!myField) return;
   
   	// IE support
   	if (document.selection) {
   		myField.focus();
   
   		sel = document.selection.createRange();
   
   		var insertText = sel.text;
   		sel.text = before + insertText + after;
   
   		if (insertText.length == 0) {
   			sel.move('character', -after.length);
   		}
   
   		sel.select();
   	}
   	// MOZILLA/NETSCAPE support
   	else if (myField.selectionStart || myField.selectionStart == '0') {
   		var startPos = myField.selectionStart;
   		var endPos = myField.selectionEnd;
   		var insertText = myField.value.substring(startPos, endPos);
   
   		myField.value = myField.value.substring(0, startPos) + before
   				+ insertText + after
   				+ myField.value.substring(endPos, myField.value.length);
   
   		if (insertText.length != 0) {
   			myField.selectionStart = myField.selectionEnd = endPos
   					+ before.length + after.length;
   		} else {
   			myField.selectionStart = myField.selectionEnd = endPos
   					+ before.length;
   		}
   	} else {
   		myField.value += text;
   	}
   
   	myField.focus();
   }

   Und so kann man es benutzen:
   

   <textarea id="field"></textarea>
   <a href="#" onclick="insertToTextareaWhereTheCursorIs('field', '', ';-)'); return false;">
     Smiley einf&uuml;gen
   </a>

   Bilder direkt einfügen geht nicht direkt über `<textarea>`. Aber du könntest ja die `<iframe>` Methode, die viele Javascript WYSIWYG Editoren benutzen, verwenden.
8. Autor dieses Themas

   achterbahn

   achterbahn hat kostenlosen Webspace.

   14:12, 26.5.2009

   VIELEN DANK hat klasse funktioniert.

9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?