Programuji BBcode editor jako rozšířené textarea a potřeboval bych pomocí javascriptu udělat uzavření označeného textu do určitého tagu. Například tady pokud píšu příspěvek, označím část textu, kliknu na tlačítko B a označený text se uzavře do tagů [ b] a [ /b]. V javascriptu se neorientuju na dostatečné úrovni, zvládám jen základní věci a proto jsem se obrátil na vás.
Neporadil by mi někdo, jak to naprogramovat?
Fórum › JavaScript, AJAX, jQuery
Uzavření označeného textu do BBcode tagů

To tom*p : Co takhle si zobrazit zdrojový kód ? Či znáš Firebug ?
V JS existuje objekt Range a Selection, zkus tuhle ukázku (autor v podstatě řeší to samé co ty):
http://www.jaknaweb.com/zapsat.php?f=1&r=108346 http://www.jaknaweb.com/zapsat.php?f=1&r=108346
Tohle vkládá místo HTML tagů [x]&[/x] tagy - pomocí tlačítek (testováno v Opeře,FF,IE6/7)
http://exstream.atlasweb.cz/BBeditor.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title>BBcode editor: adding format tags into textarea</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style>
* {margin:0;padding:0}
form { margin: 1em }
form textarea {
width: 90%;
min-width: 50ex;
max-width:120ex; height:40ex;
display:block; clear:both;
padding:0.5ex; border: 2px inset gray; overflow:auto; font: 14px "Courier New"
}
form button {
width: 10ex; height:2em;
line-height:1.5;
display:block; float:left;
margin: 1ex 1ex 1ex 0;
text-align:center;
font: small-caption;
}
</style>
<script>
function formatuj(tag){
var el=document.getElementById("edit");
var tagstart="["+tag+"]";
var tagend="[/"+tag+"]";
if (el.setSelectionRange) {
el.value =
el.value.substring(0,el.selectionStart) + tagstart +
el.value.substring(el.selectionStart,el.selectionEnd) + tagend +
el.value.substring(el.selectionEnd,el.value.length);
} else {
var selectedText = document.selection.createRange(el).text;
if (selectedText) document.selection.createRange(el).text = tagstart + selectedText + tagend;
}
}
</script>
</head>
<body>
<form onSubmit="return false">
<button onclick="formatuj('B')">TUČNĚ</button>
<button onclick="formatuj('CODE')">KÓD</button>
<button onclick="formatuj('URL')">ODKAZ</button>
<textarea id="edit">
http://programujte.com/index.php?akce=diskuze&kam=diskuze&sekce=18-javascript
Programuji BBcode editor jako rozšířené textarea a potřeboval bych pomocí javascriptu udělat uzavření označeného textu do určitého tagu.
Například tady pokud píšu příspěvek, označím část textu, kliknu na tlačítko B a označený text se uzavře do tagů [ b] a [ /b].
</textarea>
</form>
</body>
</html>

Přidej příspěvek
Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!
Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku
×Vložení zdrojáku
×Vložení obrázku
×Vložení videa
Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×






























































Uživatelé prohlížející si toto vlákno
Uživatelé on-line: 0 registrovaných, 27 hostů
Podobná vlákna
[Firefox] Pozice označeného textu na stránce — založil soudruh
Funkce pro úpravu textu do html tagu — založil john
BBCode to (X)HTML - Překladač — založil D-Fox
Súrne- Ako vložiť BBcode do php-fusion? — založil w3q
Uzavreni formulare — založil Frek
Moderátoři diskuze