Autor Zpráva
dan5505
Profil *
Zdravím,
mám jeden problém. potxeboval bych script co dokáže formátovat text v <textarea> pomocí BBcode značek.

Sesmolil jsem tento script:

function BBCode(CO) {
    var doc = document.Tform.bodyTXT;
 
    var tagy="["+CO+"][/"+CO+"]";
    doc.value += tagy;
}
.........................

   
<form name="Tform">
<input type="button" value="B" onClick="BBCode('B')">
<textarea rows="10" cols="50" name="bodyTXT"></textarea>
</form>


Ten script funguje, jenže já potřebuju aby po tom co vloží BBcode značky předal zaměření textareaře a ktomu
jěště aby dal kurzor mezi BBcode značky nebo když uživatel označí text aby dal BBcode na začátek a konec označeného textu.
tak jako je to na tomto fóru.
Předem děkuji za všechny rady.
pexxxik
Profil
Ahoj, Teď řeším úplně stejný problém jako ty:D a rozhodl jsem se googlit a vše dobře dopadlo;), našel jsem stránku na které je to dostatečné: Odkaz ..... kód jsem si trochu poupravil a je vše podle mých potřeb....
MCKAY
Profil
pexxik, dan5505: googlit si opravdu nemusel, stačilo se podivat tady v diskusy. Řešilo se to už několikrát. Například zde: http://diskuse.jakpsatweb.cz/index.php?action=vthread&topic=92530&forum=8&page=-1


Předpokládám, že potom určitě budeš chtít i nějaký chytrý převod. Dříve bych to dělal přes str_replace();
ale dnes už bych použil preg_replace(); takže to sem uvedu, pro případ, že by si to potřeboval

[ b ] a [ b ] převedeš:

$text = $_POST["text"]; // treba, já nevím, jak se to u tebe jmenuje.
$text = preg_replace("/\[b\](.*)\[\/b\]/", "<b>$1</b>", $text);


A tak podobně. Pokud to víš, tak budiž, poslouží to třeba ostatním.:-)
dan5505
Profil *
našel jsem stránku na které je to dostatečné: Odkaz
jo díky to sem taky našel. ale má to jeden háček. ten script se vztahuje jen na označený text.
já potřebuju aby ještě uměl vložit bbcode značky a mezi ně umístil kurzo.

Řešilo se to už několikrát. Například zde: http://diskuse.jakpsatweb.cz/index.php?action=vthread&topic=92530&forum=8&page=-1
jo tenhle script funguje. a taky to má háček. Myslel jsem že z výše uvedeného scriptu každý pozná jak jsem na tom s JS.
ten script má přes 90 řádků. a navíc používá nějákej zvláštní objektový model.
například tohle : document.forms["postMsg"].elements["poslText"];
fakt nevím jak na to ten programátor přišel. já bych to zapsal takhle document.postMsg.poslText; co je to elements ??
nebo typeof.
nenašel by se nějákej dobrák co by mi vysvetlil jak ten script pracuje.

P.S.
pěkný způsob převodu.
já to to dělám přez str_replace()
Chamurappi
Profil
Reaguji na dana5505:
ten script má přes 90 řádků
Ano, je docela krátký. Jeho novější verze bude mít přes 3000 řádků :-)

> například tohle : document.forms["postMsg"].elements["poslText"];
> fakt nevím jak na to ten programátor přišel. já bych to zapsal takhle document.postMsg.poslText; co je to elements ??
To je jen upovídanější varianta, pro někoho může být názornější. Funguje v podstatě stejně jako ten tvůj zápis, až na to, že v kolekci „forms“ jsou jen formuláře a v kolekci „elements“ na formuláři jen ty elementy, které se týkají formuláře.
Pro pořádek ještě zmíním, že zápisy objekt["vlastnost"] a objekt.vlastnost jsou ekvivalentní, takže jde používat třeba i document.forms.postMsg.elements.poslText, nebo document["postMsg"]["poslText"].

nebo typeof
Viz nápověda u Mozilly.

já to to dělám přez str_replace()
Jak ošetřuješ situace, kdy ti někdo neuzavře značku? To máš pak neuzavřenou tučnost i v HTML?
_es
Profil
Chamurappi
zápisy objekt["vlastnost"] a objekt.vlastnost jsou ekvivalentní,
Nie celkom, prvý zápis je univerzálnejší, ak by bola vlastnosť napríklad "100" alebo "1x", tak druhý zápis sa nedá použiť.
dan5505
Profil
jo tak já sem asi úplná lama.
myslel jsem že po php bude JS hračka. Ale není.
takovejhle script:
<html>
  <head>
  <title></title>
  
  <script type="text/javascript">
  <!--
    function insertTag(tag, parovy, text, prependText, appendText)
{
	//inicializace proměných
	var textarea = document.forms["postMsg"].elements["poslText"];

	var startTag = '[' + tag + ']';
	var endTag = '[/' + tag + ']';

	if (typeof text == 'undefined') {
		var tagText = getTextareaSelection();
	} else {
		var tagText = text;
	}
	
	if (typeof parovy == 'undefined') {
		var parovy = true;
	}

	if (typeof prependText == 'undefined') {
		var prependText = '';
	}
	
	if (typeof appendText == 'undefined') {
		var appendText = '';
	}
	
	
	//přepsání výchozích hodnot pro specifické tagy
	if (tag == 'url') {
		if (tagText == '') {
			tagText = 'Odkaz';
		}
		var regexp = new RegExp("^((http|https|ftp)\\://)([a-zA-Z0-9\\.\\-]+(\\:[a-zA-Z0-9\\.&%\\$\\-]+)*@)?((25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9])|([a-zA-Z0-9\\-]+\\.)*[a-zA-Z0-9\\-]+\\.[a-zA-Z]{2,4})(\\:[0-9]+)?(/[^/][a-zA-Z0-9\\.\\,\\?\\'\\\\/\\+&%\\$#\\=~_\\-@]*)*$");
		var regexp2 = new RegExp("^([a-zA-Z0-9\\.\\-]+(\\:[a-zA-Z0-9\\.&%\\$\\-]+)*@)?((25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9])|www\\.([a-zA-Z0-9\\-]+\\.)*[a-zA-Z0-9\\-]+\\.[a-zA-Z]{2,4})(\\:[0-9]+)?(/[^/][a-zA-Z0-9\\.\\,\\?\\'\\\\/\\+&%\\$#\\=~_\\-@]*)*$");
		
		if (regexp.test(tagText)) {
			startTag = '[url=' + tagText + ']';
		} else if (regexp2.test(tagText)) {
			startTag = '[url=http://' + tagText + ']';
		} else {
			startTag = '[url=http://example.com]';
			selectionStart = prependText.length + 5;
			selectionEnd = prependText.length + 23;
		}
	}
		
	//vytvoření textu pro vložení
	if (!parovy) {
		endTag = '';
	}
		
	var text2insert = prependText + startTag + tagText + endTag + appendText;
	
	//vložení:
	textarea.focus();
	
	if (typeof textarea.selectionStart != 'undefined') {
		var start = textarea.selectionStart;
		var end = textarea.selectionEnd;
		
		textarea.value = textarea.value.substr(0, start) + text2insert + textarea.value.substr(end);
		
		//nastaveni kurzoru na spravné misto / vybrani pozadovaneho textu
		if (typeof selectionStart != 'undefined' && typeof selectionEnd != 'undefined') {
			textarea.selectionStart = start + selectionStart;
			textarea.selectionEnd = start + selectionEnd;
		} else {
			if (tagText == '') {
				//skoceni mezi tagy
				textarea.selectionStart = start + prependText.length + startTag.length;
				textarea.selectionEnd = start + prependText.length + startTag.length;
			} else {
				//skoceni za posledni tag
				textarea.selectionStart = start + text2insert.length;
				textarea.selectionEnd = start + text2insert.length;
			}
		}
	}
	else if (typeof document.selection != 'undefined') {
		var range = document.selection.createRange();
		range.text = text2insert;
		
		//nastaveni kurzoru na spravné misto / vybrani pozadovaneho textu
		if (typeof selectionStart != 'undefined' && typeof selectionEnd != 'undefined') {
			range.moveStart('character', -text2insert.length + selectionStart);
			range.moveEnd('character', -text2insert.length + selectionEnd);
		} else {
			if (tagText == '') {
				//skoceni mezi tagy
				range.move('character', -(endTag.length + appendText.length));
			} else {
				//skoceni za posledni tag
				//protoze prohlizec v tomto pripade skoci za posledni tag automaticky, neni treba nic posouvat	
			}
		}
		range.select();
	}

	//unset promenych
	delete selectionStart;
	delete selectionEnd;
}

function getTextareaSelection()
{
	var textarea = document.forms["postMsg"].elements["poslText"];
	
	if (typeof textarea.selectionStart != 'undefined') {
		var selection = textarea.value.substring(textarea.selectionStart, textarea.selectionEnd);
	} else if (typeof document.selection != 'undefined') {
		var selection = document.selection.createRange().text;
	} else {
		//alert('Bug!');
	}
	return selection;
}

  //-->
  </script>
  </head>
  <body>
     <form name="postMsg">
     <input type="button" value="B" onClick="insertTag('b'); return false;"><br>
     <textarea name="poslText" rows="10" cols="40"></textarea>
     </form>
  </body>
</html>


prostě se svíma nynějšíma znalostma JS sám nepochopím.
Chceto nějákej help Hesky česky a bez reklam jako na rádiu Blaník :-))
Chamurappi
Profil
Reaguji na _es:
Ano, vím, ale tazatel to vědět nepotřebuje, když tu univerzálnější metodu pravděpodobně neznal.


Reaguji na dana5505:
Co to dělá? Co to nedělá? Odkaž prosím na živou ukázku, jestli máš zájem o nějakou radu.
peta
Profil
dan5505
"BBcode na začátek a konec označeného textu. tak jako je to na tomto fóru. "
Dival ses do JS zdrojaku fora? Tam to vsechno je, nic neni ukryto.

"Řešilo se to už několikrát. Například zde: http://diskuse.jakpsatweb.cz/index.php?action=vthread&topic=92530&forum=8&page=-1 "
Dival ses na tu adresu nekdy a na odkazy na ni? treba ja tam dal jednoduchy editor, ktery to vsechno dokaze. Zrejme neco podobne i ostatni. Pokud si prispevky nectes, ma smysl ti nejake psat?

Pokud mas problem se svym kodem, vytvor jednoduchou stranku a dej na ni odkaz, aby meli vsichni k dispozici stejny kod.
Odpovedi typu nemuzu, je to tajne, neumim dat stranku na web, nechci, takovym lidem se neda pomoci.
dan5505
Profil
Jak ošetřuješ situace, kdy ti někdo neuzavře značku? To máš pak neuzavřenou tučnost i v HTML?
hmm k tomu sem se ještě nedostal. za prvé donedávna sem používal WYSIWYG editor kterej sem stáhl z netu
a zadruhé mně ani nenapadlo že by někdo naschvál neuzavřel značku.

Co to dělá? Co to nedělá? Odkaž prosím na živou ukázku, jestli máš zájem o nějakou radu.
je to asi neuvěřitelné ale funguje to. dokonce to umí i vlkádat url tagy a určitě mnoho dalšího...

problém spočívá v tom že vůbec nevím jak funguje nemůžu si sám zotpovědět tyto otázky:

1) jak zjistit pozici kurzoru v textareaře
2)jak nastavit kurzor na zvolenou pozici v textareaře
3)jak vložit na zvolenou pozici text.
4)pokud je v textareaře označený text jak vložit text na začátek a konec označeného textu.

tohle je vlastně můj problém.
dan5505
Profil
Dival ses na tu adresu nekdy a na odkazy na ni? treba ja tam dal jednoduchy editor, ktery to vsechno dokaze. Zrejme neco podobne i ostatni. Pokud si prispevky nectes, ma smysl ti nejake psat?
nemyslíš náhoodou tenhle odkaz ? http://www.volny.cz/peter.mlich/jpw/#formulare
dan5505
Profil
Pokud mas problem se svym kodem, vytvor jednoduchou stranku a dej na ni odkaz, aby meli vsichni k dispozici stejny kod.
Odpovedi typu nemuzu, je to tajne, neumim dat stranku na web, nechci, takovym lidem se neda pomoci.


ten kod neni muj. ale je z tohoto fora...
problem je že s JS začínám a nerozumim mu.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: