PDA

View Full Version : Selection unutar textarea (BBCode editor)


TROOPER
16-11-2005, 12:41
Pozdrav!

Zanima me kako napraviti sistem slican ovome na forumu:

Unutar <textarea> imamo tekst (u browseru) koji selektiramo. Kada kliknemo na 'gumbic', selektirani_tekst se pretvori u [ B ]selektirani_tekst[ /B ].

Guglao sam do ovoga:

sT = document.selection.createRange();
sTxt = sT.text;
if(!sTxt.length > 0)
{
alert('Selektrirajte tekst koji zelite da bude bold!');
return( false);
}
sT.text = '[ B]' + sTxt + '[/B ]';


...ali ne radi u Firefoxu (konkretno 1.0.7.). Zacudio sam se kad sam skuzil da cak radi u Operi.

Muljao sam nesto sa document.getSelection() ali nista od toga.

Obzirom da nisam maher u JS-u, nisam bas uspio prokuziti kako je to izvedeno ovdje na VBulletin forumu.

..pa prosim lijepo ak je netko prokuzio sistem da napise kako.

Zahvaljujem

TROOPER
06-12-2005, 09:57
Eto uz pomoc kolege dodjoh do ovog rjesenja. Radi u IE, Operi i Firefox-u (1.0.7).
Nadam se da ce mnogima koristiti.

<SCRIPT language="JavaScript" type="text/JavaScript">
function IEhack(obj){
if( typeof(obj.createTextRange) != 'undefined' ) obj.gdje = document.selection.createRange().duplicate();
}

function ubaci(gdje, kaj1, kaj2){
if(typeof(gdje.createTextRange) != 'undefined' && gdje.gdje) gdje.gdje.text = kaj1 + gdje.gdje.text + kaj2;
else if(typeof(gdje.selectionStart) != 'undefined'){
var tmp = gdje.selectionStart, tmp2 = gdje.selectionEnd + kaj1.length;

gdje.value = gdje.value.substr(0,tmp) + kaj1 + gdje.value.substr(tmp);
gdje.value = gdje.value.substr(0,tmp2) + kaj2 + gdje.value.substr(tmp2);
gdje.setSelectionRange(tmp + kaj1.length+1,tmp + kaj2.length-1);
}
else gdje.value += kaj1 + kaj2;

gdje.focus();
}
</SCRIPT>

<form name="test">

<input type=button value="B" style="font-weight: bold;"
onMouseDown="
ubaci(this.form.text, '', '');
return false;
">
<input type=button value="i" style="font-style: italic;"
onMouseDown="
ubaci(this.form.text, '', '');
return false;
">
<input type=button value="U" style="text-decoration: underline;"
onMouseDown="
ubaci(this.form.text, '', '');
return false;
">

<br /><br />

<textarea name="text" id="text" style="width: 300px;height: 200px;" ONSELECT="IEhack(this);" ONCLICK="IEhack(this);" ONKEYUP="IEhack(this);"></textarea>
</form>