Mam problem, który mnie przerósł.
Używam funkcji BBCode.
Kod
function BBCode(name, before, after)
{
textarea = document.forms['form'].elements[name];
if ((typeof textarea.selectionStart) != 'undefined')
{
ss = textarea.selectionStart;
se = textarea.selectionEnd;
st = textarea.scrollTop;
v1 = (textarea.value).substring(0, ss);
v2 = (textarea.value).substring(ss, se);
v3 = (textarea.value).substring(se, textarea.textLength);
textarea.value = v1 + before + v2 + after + v3;
if (!!window.opera)
{
textarea.selectionStart = (v1 + before + v2).length;
}
else
{
textarea.selectionEnd = (v1 + before + v2).length;
}
textarea.scrollTop = st;
textarea.focus();
}
else
{
if (document.selection)
{
str = document.selection.createRange().text;
textarea.focus();
sel = document.selection.createRange();
sel.text = before + str + after;
}
else
{
textarea.value += before + after;
}
}
}
{
textarea = document.forms['form'].elements[name];
if ((typeof textarea.selectionStart) != 'undefined')
{
ss = textarea.selectionStart;
se = textarea.selectionEnd;
st = textarea.scrollTop;
v1 = (textarea.value).substring(0, ss);
v2 = (textarea.value).substring(ss, se);
v3 = (textarea.value).substring(se, textarea.textLength);
textarea.value = v1 + before + v2 + after + v3;
if (!!window.opera)
{
textarea.selectionStart = (v1 + before + v2).length;
}
else
{
textarea.selectionEnd = (v1 + before + v2).length;
}
textarea.scrollTop = st;
textarea.focus();
}
else
{
if (document.selection)
{
str = document.selection.createRange().text;
textarea.focus();
sel = document.selection.createRange();
sel.text = before + str + after;
}
else
{
textarea.value += before + after;
}
}
}
Funkcja ta jest dodana na początku dokumentu w tagu <head>, zajmuje się dodawaniem tagów BBCode do pola tekstowego.
Kod
<img class="bbcode" alt="message [b] [/b]" src="b.png" title="Pogrubienie" />
<img class="bbcode" alt="message [u] [/u]" src="u.png" title="Podkreślenie" />
<img class="bbcode" alt="message [i] [/i]" src="i.png" title="Kursywa" />
<textarea name="message" rows="3" cols="28"></textarea>
<img class="bbcode" alt="message [u] [/u]" src="u.png" title="Podkreślenie" />
<img class="bbcode" alt="message [i] [/i]" src="i.png" title="Kursywa" />
<textarea name="message" rows="3" cols="28"></textarea>
Na samym końcu dokumentu dodaję funkcję sprawdzającą tagi "img" w celu znalezienia tych, które są odpowiedzialne za wstawienie BBCode'u.
Kod
<script type="text/javascript">
obrazek = document.getElementsByTagName('img');
for (i = 0; i < obrazek.length; i++)
{
if (obrazek[i].className=='bbcode')
{
names = obrazek[i].getAttribute('alt').split(' ')
obrazek[i].onclick = function() {return BBCode(names[0], names[1], names[2]);}
}
}
</script>
obrazek = document.getElementsByTagName('img');
for (i = 0; i < obrazek.length; i++)
{
if (obrazek[i].className=='bbcode')
{
names = obrazek[i].getAttribute('alt').split(' ')
obrazek[i].onclick = function() {return BBCode(names[0], names[1], names[2]);}
}
}
</script>
Niby wszystko jest OK, ale gdy klikam by dodać pogrubienie wyskakuje mi kursywa, gdy klikam na podkreślenie, również wyskakuje mi kursywa, prawdopodobnie funkcja na końcu dokumentu przydzieliła parametry tylko raz, dla ostatniej klasy, czyli kursywy.
Jest sposób, aby przydzielało dla każdego z osobna? Tzn. gdy kliknę na pogrubienie, chciałbym mieć pogrubienie, a nie kursywę, to samo dotyczy reszty tagów.
Pozdrawiam.
