Tekst toevoegen in textarea op plaats van cursor

[tharobin]

Hallo,
Ik ben bezig met een kleine WYSIWYG editor. Dus codes als [ b ] [ / b ] in een tekstarea toevoegen.
Werkt allemaal goed alleen plaatst hij de codes aan het einde van de tekst.
Deze wil ik op de plaats van de cursor hebben of om geselecteerde tekst plaatsen (zoals dit forum, alleen eenvoudiger).
Iemand een oplossing?

function addText(text) {
[INDENT]document.formWijzigen.beschrijving.value=document.formWijzigen.beschrijving.value+text;
document.formWijzigen.beschrijving.focus();
return;[/INDENT]
} 

<a href="#" onClick="javascript: addText('[ b ][ / b ]')"><b>Vet</b></a>
<a href="#" onClick="javascript: addText('[ u ][ / u ]')"><b>Onderstreep</b></a>

 

[JP Romijn]

Je bent op zoek naar de caret position van een tekstveld. Als je daar op googlet kan je vast wel een scriptje vinden.

 

[tharobin]

Even gezocht naar Caret Positions.
Heb nu de volgende code:
Dit werk aardig maar de cursor springt na het toevoegen een paar regels terug
Ook vervangt hij de geselecteerde tekst bij het toevoegen ipv toevoegen.
Ik wil het eigenlijk zo hebben dat hij de code om de cursor/geslecteerde tekst heen plaatst.
Maar als dit te moeilijk wordt hoeft het niet. Ik wil alleen dat de cursor op de juiste plek blijft staan.

Als ik ipv :
<a href="#" onclick="javascript: insertAtCaret(formVacature.beschrijving, '[ b ][ / b ]' '')"><b>Vet</b></a>
Dit doe:
<a href="#" onclick="javascript: insertAtCaret(formVacature.beschrijving, '[ b ]' '')"><b>Vet</b></a>
Werkt het wel ?????

Ben niet zo handig met javascript
Iemand een idee?

function insertAtCaret(obj, text) {
		if(document.selection) {
			obj.focus();
			var orig = obj.value.replace(/\r\n/g, "\n");
			var range = document.selection.createRange();

			if(range.parentElement() != obj) {
				return false;
			}

			range.text = text;
			
			var actual = tmp = obj.value.replace(/\r\n/g, "\n");

			for(var diff = 0; diff < orig.length; diff++) {
				if(orig.charAt(diff) != actual.charAt(diff)) break;
			}

			for(var index = 0, start = 0; 
				tmp.match(text) 
					&& (tmp = tmp.replace(text, "")) 
					&& index <= diff; 
				index = start + text.length
			) {
				start = actual.indexOf(text, index);
			}
		} else if(obj.selectionStart) {
			var start = obj.selectionStart;
			var end   = obj.selectionEnd;

			obj.value = obj.value.substr(0, start) 
				+ text 
				+ obj.value.substr(end, obj.value.length);
		}
		
		if(start != null) {
			setCaretTo(obj, start + text.length);
		} else {
			obj.value += text;
		}
	}
	
	function setCaretTo(obj, pos) {
		if(obj.createTextRange) {
			var range = obj.createTextRange();
			range.move('character', pos);
			range.select();
		} else if(obj.selectionStart) {
			obj.focus();
			obj.setSelectionRange(pos, pos);
		}
	}

<a href="#" onclick="javascript: insertAtCaret(formVacature.beschrijving, '')"><b>Vet</b></a>

 

[tharobin]

Heb het opgelost.
Goed script gevonden!

	function smile(veld, smile)
{
	if (document.selection)
  	{
		veld.focus();
		var selection = document.selection.createRange();
		selection.text = smile;
  	}
  	else if (veld.selectionStart || veld.selectionStart == '0')
  	{
		var startPos = veld.selectionStart;
		var endPos = veld.selectionEnd;

		veld.value = veld.value.substring(0, startPos)
		+ smile + veld.value.substring(endPos, veld.value.length);
  	}
  	else
  	{
		veld.value += smile;
  	}
}

function tag(veld, tag1, tag2)
{
	if (!tag2)
	{
		tag2 = tag1;
	}

	if (document.selection)
	{
		veld.focus();
		var selection = document.selection.createRange();

		if(selection.text)
		{	
			selection.text = "["+tag1+"]"+selection.text+"[/"+tag2+"]";
		}
		else
		{
			veld.value += "["+tag1+"] [/"+tag2+"]";
		}
	}
	else if (veld.selectionStart || veld.selectionStart == '0')
	{
		var startPos = veld.selectionStart;
		var endPos = veld.selectionEnd;

		if (startPos != endPos)
		{
			veld.value = veld.value.substring(0, startPos)
			+ "["+tag1+"]"
      			+ veld.value.substring(startPos, endPos)
			+ "[/"+tag2+"]"
			+ veld.value.substring(endPos, veld.value.length);
		}
		else
		{
			veld.value = veld.value.substring(0, startPos)
			+ "["+tag1+"] [/"+tag2+"]"
			+ veld.value.substring(endPos, veld.value.length);
		}
	}
}

<a href="#" onClick="tag(formVacature.beschrijving, 'b', '')"><b>Vet</b></a>