Wstawianie tekstu w <textarea> za pomocą przycisków


(Stonek 91) #1

Tak jak w temacie

chciałbym aby po kliknięciu przycisku w pole w miejscu gdzie był kursor wstawiał się jakiś tekst

z góry dzięki...


(Marrek13) #2

http://www.strefaphp.net/topic72.html

Wystarczy minimalnie przerobić funkcję do wstawiania emotikony :wink:


(Stonek 91) #3

działa, ale ten tekst wstawia się na końcu a ja chciałem aby wstawiał się tam gdzie był kursor


(Marrek13) #4

Rzeczywiście pospieszyłem się z napisaniem odpowiedzi. Naprawiam jednak swój błąd:

http://parentnode.org/javascript/workin ... -position/

Testowałem i działa zarówno pod FF jak i pod IE.

Nie jestem tylko pewny, czy na początku funkcji insertAtCaret nie należałoby dodać

obj = document.getElementById(obj);

(Stonek 91) #5

mógłbyś to złożyć w jedną całość bo mi nie wychodzi :frowning:


(Marrek13) #6
function insertAtCaret(obj, text) { 

    if(document.selection) { 


		obj = document.getElementById(obj);

		obj.focus(); 


		var range = document.selection.createRange(); 


		if(range.parentElement() != obj) { 

		    return false; 

		} 


		var orig = obj.value.replace(/rn/g, "n"); 


		range.text = text; 


		var actual = tmp = obj.value.replace(/rn/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); 

    }

}

Dla textarea nadajesz id np. "text", a funkcję wywołujesz wtedy poprzez "insertAtCaret('text', 'tresc');" - pierwszy parametr to ID obiektu, drugi - tekst do wstawienia.


(Stonek 91) #7

niestety nie działa pod FF


(Marrek13) #8

Chyba dzisiaj nie wyspałem się dobrze.

Zamień:

if(document.selection) {


      obj = document.getElementById(obj);

na

obj = document.getElementById(obj);


if(document.selection) {

(Stonek 91) #9

Niestety pod FF nadal nie działało, ale po małych przeróbkach zrobiłem taki oto kod:

function insertAtCaret(text) 

	{

		obj = document.forms['nazwa_formularza'].elements['nazwa_pola'];


    	if(document.selection) 

    	{

      	obj.focus();


      	var range = document.selection.createRange();


      	if(range.parentElement() != obj) 

      	{

         	return false;

      	}


      	var orig = obj.value.replace(/rn/g, "n");


      	range.text = text;


      	var actual = tmp = obj.value.replace(/rn/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);

	      obj.focus();

    	}

	}

lecz jest jeszcze jeden błąd w FF, a mianowicie po naciśnięciu przycisku, kursor ustawia się na końcu, czy można by było zrobić tak, aby stał zaraz za tym wstawionym tekstem?


(Marrek13) #10

Tym razem dokładnie sprawdziłem i działało, no ale jeśli sobie poradziłeś na swój sposób, w porządku. Co do ostatniego pytania, u mnie w tej kwestii wszystko jest ok(może dlatego, że korzystam z wersji beta wydania 3-go).