Данный код показывает, как сделать вставку тегов(в нашем случае bb) в поле или выделить ими текст.
Инструкции
Вставить скрипт в <head></head>
создать кнопки с атрибутом onClick="tag_add(куда,'от крывающий тег','зыкрывающий тег')"
в функции tag_add(obj, str1, str2):
obj - объект где происходит вставка
str1 - открывающий тег
str2 - закрывающий тег
для распознавания объекта присваеваем объекту id и испольуем document.getElementById('') в нашем случае id="msg"
пример использования ниже
Код
<html>
<head>
<title>Вставка BB-тегов </title>
<script>
//Вставка BB тегов
function tag_add(obj, str1, str2)
{
obj.focus();
// Для IE
if(document.selection)
{
var s = document.selection.createRange();
if(s.text)
{
if(str2!="")s.text = str1 + s.text + str2;
else s.text = str1;
s.select();
}
else
{
s.text = str1 + s.text + str2;
s.select();
}
return true;
}
// Opera, FireFox
else if (typeof(obj.selectionStart) == "number")
{
//Обрамляем тегами выделенный текст
if (obj.selectionStart != obj.selectionEnd)
{
var start = obj.selectionStart;
var end = obj.selectionEnd;
s = obj.value.substr(start,end-start);
tmp=obj.value.substr(end);
if(str2!="")obj.value = obj.value.substr(0, start) + str1 + s + str2;
else obj.value = obj.value.substr(0, start) + str1;
tmpsel = obj.value.length - str2.length;
tmpscroll=obj.scrollHeight;
cnt = obj.value.split(/[\r\n]/g).length;
obj.value+=tmp;
obj.selectionStart = obj.selectionEnd = tmpsel;
if(cnt>obj.rows)obj.scrollTop = tmpscroll-12;
}
//Вставляем теги в позицию курсора
else
{
var start = obj.selectionStart;
tmp=obj.value.substr(start);
obj.value = obj.value.substr(0, start) + str1 + str2;
tmpsel = obj.value.length - str2.length;
tmpscroll=obj.scrollHeight;
cnt = obj.value.split(/[\r\n]/g).length;
obj.value+=tmp;
obj.selectionStart = obj.selectionEnd = tmpsel;
if(cnt>obj.rows)obj.scrollTop = tmpscroll;
}
//В tmpscroll запоминаем позицию скроллбара - в силу того, что в некоторых браузерах при замене текста он прокручивается вверх.
return true;
}
return false;
}
</script>
</head>
<body>
<form>
<textarea rows="5" cols="50" id="msg">Kbyte.ru</textarea><br>
<input type="button" onclick="tag_add(document.getElementById('msg'),'<strong>','</strong>')" value="Жирный"><input type="button" onclick="tag_add(document.getElementById('msg'),'<span style="text-decoration:underline;">','</span>')" value="Подчеркнутый"><input type="button" onclick="tag_add(document.getElementById('msg'),'<em>','</em>')" value="Курсив">
</form>
</body>
</html></body>