ВИЗИВИГ

Пробы Визивига

by Anton Kolesnikov

HTML

<textarea name="text_">Тут текст, который должен работать!</textarea>
<br />
<button type="button" id="btn" onclick="insertTag('text_','<strong>','</strong>');">
    Click!
</button>

CSS

#txt {
    width: 100%;
    height: 100px;
}
#btn {
    width: 100%;
    line-height: 38px;
}

JavaScript

/* function setSelection( obj_name, tag_start, tag_end ) {
    
    // Берем объект
    var area = document.getElementsByName('txt').item(0);
    
    // Если есть что-то выделенное, то...
    if (document.getSelection) {
        
        // ...берем все, что до выделения...
        area.value = area.value.substring( 0, area.selectionStart )    +
            
        // ... и добавляем стартовый тег.
        tag_start                                                      +
            
        // Добавляем выделенный текст ...
        area.value.substring( area.selectionStart, area.selectionEnd ) +
            
        //... и добавляем закрывающий тег
        tag_end                                                        +
            
        // Добавляем оставшийся текст после выделения
        area.value.substring( area.selectionEnd, area.value.length );
        
    } else {
        
        // Специально для IE
        
        // Берем текст
        var selectedText = document.selection.createRange().text;
        
        // Если есть выделенный текст ...
        if (selectedText != '') {
            // ...то составляем новый текст с тегами ...
            var newText = tag_start + selectedText + tag_end;
            
            /// ... и вставляем его
            document.selection.createRange().text = newText;
        }
    }
} */

//http://sd-company.su/article/js/textarea

function insertTag(_obj_name, _tag_start, _tag_end)
// _obj_name - name объекта - как правило, textarea, но при желании можно сделать любой
// указываем именно NAME, так как согласно стандартам DOCTYPE HTML 4.01 strict и выше
// свойство ID у объектов ввода является не приемлемым и требуется обращаться только name
// _tag_start - что вставлять перед выделенным текстом
// _tag_end - что вставлять после выделенного текста
{
// берем объект
var area=document.getElementsByName(_obj_name).item(0);

// Mozilla и другие НОРМАЛЬНЫЕ браузеры
// ЕСЛИ есть что-либо выделенное, ТО
if...