VPF::Решение для вставки текста после нажатия Enter

InfMag

Дата 18.4.2008, 16:39 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

Вот насобирал текст встатвки кода под курсором и опознания нажатия Enter (все по поиску тут)
Теперь же задача состоит в том, чтобы либо обмануть нажатие Enter и после каждой строки при нажатии вставлять <br>, либо каким-то методом просто парсить код и добавлять <br>-ы

Код


<script type="text/javascript" language="javascript">
var d = document;
function addText(tL,tR)
{
    if (d.selection)
    {
        var tRange = d.selection.createRange(),
            isEmpty = tRange.text=='';
        if (tRange.parentElement().tagName!='TEXTAREA') (tRange=d.all.tA.createTextRange()).collapse(false);
        tRange.text = tL+tRange.text+tR;
        if (isEmpty) tRange.move('character',-tR.length);
        tRange.select();
    } else {
        d.getElementById('tA').value += tL+tR;
    }
}
function dFocus()
{
    d.all.tA.focus();
}
function enter(evt) {
   evt = (evt) ? evt : ((window.event) ? event : null);
   var charCode = (evt.charCode) ? evt.charCode : ((evt.which) ? evt.which : evt.keyCode);
   if (charCode == 13) return true; else return false;
}
</script>

Код


<a href="javascript:void(0);" onclick="return false;" onmouseup="dFocus();" onmousedown="addText('&lt;b&gt;','&lt;/b&gt;');" onmouseover="infoblock('<b>Жирный текст</b>');" onmouseout="infoblock_hide();"><img src="{$shop_config['shop_dir_url']}images/editor/bold.gif" width="24" height="24" border="0"></a>
<textarea name="description" id="tA" style="width:500px;" rows="25" onkeydown="if(enter()){event.preventDefault();alert('1');}">{$prod['description']}</textarea>

ksnk

Дата 18.4.2008, 17:30 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

InfMag, А что происходит с текстом после того, как юзеру надоедает редактировать? Видимо юзер нажимает кнопку submit и текст отправляется на сервер? Не проще ли сделать на сервере что-нибудь типа nl2br при сохранении введенных данных?

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

bars80080

Дата 18.4.2008, 17:33 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

я так понимаю, что-то заполняется в текстареа, потом отправляется на сервер и выводится через пхп?
но ведь есть http://php.ru/manual/function.nl2br.html

Добавлено через 34 секунды
синхронное плавание

InfMag

Дата 18.4.2008, 17:58 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

Дело в том, что юзер по желанию может убирать <BR>
Вот, накалякал пробежку, но не пашел :'(

Код


<textarea name="description" id="tA" style="width:500px;" rows="25" onkeydown="if(enter()){codeParse();}else{oldStr=document.getElementById('tA').value;}"></textarea>
<script type="text/javascript" language="javascript">
var oldStr = document.getElementById('tA').value;
function codeParse()
{
    var newStr = document.getElementById('tA').value;
    if (oldStr != newStr)
    {
        var exp1 = oldStr.split('{$bn}'),
            exp2 = newStr.split('{$bn}'),
            result='',okBr=false;
        if ((exp2.length-1)==exp1.length)
        {
            for (var i=0;i<exp2.length;i++) if (exp2[i].length!=exp1[i].length && okBr==false) {exp2[i]=exp2[i]+'&lt;br&gt;';okBr=true;}
            if (okBr==true)
            {
                document.getElementById('tA').value = '';
                for (var i=0;i<exp2.length;i++) document.getElementById('tA').value += exp2[i]+'{$bn}';
                dFocus();
            }
        } else oldStr=newStr;
    }
}
</script>

InfMag

Дата 18.4.2008, 18:27 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

Вот даже сделал так, стало хоть как-то работать, но в опере вставляется <br> уже на новой строке в начале. Можно ли как-то это преодолеть? А в IE почему то вставляется только по 2-ум нажатиям Enter

Код


<script type="text/javascript" language="javascript">
var oldStr = document.getElementById('tA').value;
function codeParse()
{
    var tA = document.getElementById('tA');
    var newStr = tA.value;
    var len1=0,len2=0;
    if (oldStr != newStr)
    {
        var exp1 = oldStr.split("\n"),
            exp2 = newStr.split("\n"),
            result='',okBr=false;
        if ((exp2.length-1)==exp1.length)
        {
            for (var i=0;i<exp2.length;i++)
            {
                if (exp1[i]=='') len1=0; else len1=exp1[i].length;
                if (exp2[i]=='') len2=0; else len2=exp2[i].length;
                if (len1!=len2 && okBr==false) {addText('<br>','');okBr=true;}
            }
            if (okBr==true) dFocus();
        } else oldStr=newStr;
    }
}
</script>

Добавлено через 6 минут и 37 секунд
Кстати IE жалуется на exp1[i].length что он null или не является объектом когда строка эта пустая... Как ему объяснить что значение просто должно быть ровно нулю?

ksnk

Дата 18.4.2008, 20:35 (ссылка)

(голосов:1)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

А зачем так сложно?

Код


        <script language="JavaScript" type="text/javascript">
            function repl(BR) {
                BR=BR?'<br/>':'';
                var ta=document.getElementById('text');
                ta.value=ta.value
                    .replace(/\s*\r?\n|\s*\r\n?/g,'\r\n') // борьба за единообразие... 
                    .replace(/<br\/?>\r\n|<br\/?>|\r\n/ig,BR+'\r\n'); // все возможные BR с возможными RN
            };
        </script>
        <textarea id='text'></textarea>
        <input type='button' onclick='repl(1)' value='BR'>
        <input type='button' onclick='repl()' value='\r\n'>

Добавлено через 1 минуту и 38 секунд

Цитата(InfMag @ 18.4.2008, 18:27

)

Кстати IE жалуется на exp1[i].length...

Код


len1=(exp1[i] && exp1[i].length )|| 0;

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

InfMag

Дата 22.4.2008, 14:33 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

ksnk, огромное спасибо! помогло, но осталась маленькая проблема, фокус убегает непонятно куда, а не на следующую строку...

Добавлено через 3 минуты и 19 секунд
Кстати именно то, что нужно мне вот:

Код


tA.value = tA.value.replace(/<br?>\r\n|<br?>|\r\n/ig,BR+'\r\n');

Но никак не могу справиться с фокусом :'(

Добавлено через 11 минут и 49 секунд
Или хотябы если кто знает - подскажите, как можно поставить курсор на начало какой-либо строки, допустим на 3-ю строку, а там можно алгоритм составить...

ksnk

Дата 22.4.2008, 15:23 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

Вот пара функций, выкушеных из BrowserExtensions от Ilya Lebedev. Как-то надо было более менее разумно все это реализовать.

Код


<script type='text/javascript'>

function EL(){return document.getElementById('txt')}

/**  
 *  цельнотянуто by ksnk from BrowserExtensions/documentselection.js
 *  @author Ilya Lebedev
 */
        var getPos = function (el, start) {
            var off;
            try {
                el.setActive();
                if (start)
                    off = Math.abs(document.selection.createRange().moveStart("character", -100000000));
                else
                    off = Math.abs(document.selection.createRange().moveEnd("character", -100000000));
                /*
                *  test for the TEXTAREA's dumb behavior
                */
                if (el.tagName.toLowerCase() != 'input') {
                    /*
                    *  calculate node offset
                    */
                    var r = document.body.createTextRange();
                    r.moveToElementText(el);
                    var sTest = Math.abs(r.moveStart("character", -100000000));
                    off -= sTest;
                }
            } catch (e) {
                try {
                    off = (start?el.selectionStart:el.selectionEnd);
                } catch (e) {
                    off = 0;
                }
            }
            return off;
        },
        setRange = function (el,start,end) {
            if ('function' == typeof el.setSelectionRange) {
                /*
                *  for Mozilla
                */
                try {el.setSelectionRange(start, end)} catch (e) {}
            } else {
                /*
                *  for IE
                */
                var range;
                /*
                *  just try to create a range....
                */
                try {
                    range = el.createTextRange();
                } catch(e) {
                    try {
                        range = document.body.createTextRange();
                        range.moveToElementText(el);
                    } catch(e) {
                        return false;
                    }
                }
                range.collapse(true);
                range.moveStart("character", start);
                range.moveEnd("character", end - start);
                range.select();
            }
        }
</script>
<textarea id='txt'></textarea>
<input id='pos' type='text'>
<input type='button' value='set' onclick='var i=document.getElementById("pos").value;setRange(EL(),i,i);EL().focus();')>
<input type='button' value='asc' onclick='alert(getPos(EL(),1))'>

Соответственно, getPos позволит сохранить текущее значение курсора, setRange - восстановить. Чтобы курсор не прыгал с литеры на литеру, можно разбить строку-значение на две части и заменять по отдельности.

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

InfMag

Дата 22.4.2008, 15:52 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

ksnk, блин, эта тема не помогла, лишь начала после ставить курсор в начало. А есть какой-нибудь простой способ поставить курсор на определенную строку??

Добавлено через 28 секунд
ksnk, или хотябы начиная с какого-нибудь символа символа??

Добавлено через 2 минуты и 45 секунд
ksnk, ах да! smile

понял... setrange smile

InfMag

Дата 22.4.2008, 16:32 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

ХОТЯ СТОП!!!
По своей глупости промотал мимо ушей, у тебя после каждого \r\n содается БР, а это можно вобще было в ПХП провернуть, задача короче совсем в другом. Нужно только на месте Enter-а втыкать ентот БР

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »