VPF::jquery замена value в input - Форум программистов

maxipub

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

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 517
Регистрация: 22.10.2009

Репутация: нет
Всего: 1

Добрый день еще раз!

Ребята, итак есть input-ы для ввода чисел. По умолчанию дробная часть отделяется точкой, но многие любят использовать запятую. В любом случае это все обрабатывается на уровне приема значений (JavaScript скриптами для их обработки, PHP и т.д.), но для красоты хотелось бы "на лету" менять запятые на точки и в самих input-ах.

Отслеживаю oninput, проверяю $(this).val().indexOf(','), и если запятая имеется, делаю $(this).val($(this).val().replace(',', '.'));

Все ок, но есть один некрасивый момент. Например, пользователь ввел "100". И потом ставит курсор после первого нуля чтобы поставить точку и получить "10.0". И если вместо точки он введен запятую, она корректно заменится на точку, но курсор будет перемещен в самый конец строки. Можно ли как-то на лету делать такую замену с сохранением позиции курсора в троке?

Спасибо!

Это сообщение отредактировал(а) maxipub - 8.12.2015, 18:00

ksnk

Дата 8.12.2015, 18:30 (ссылка)

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

Загрузка ...

прохожий

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

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

Использовал такой вот плагин для jQuery. В комментариях - описание работы
var x = $(this).carret() - позиция курсора, перед изменением значения ее нужно сохранить, после изменения - восстановить
$(this).carret(x);

Работает только с текстовыми полями - input/textarea.

Код


    /**
     * работа с курсором. Работаем с первым элементом коллекции.
     * .carret('get')|| .carret() - выдать позицию курсора, верхняя граница отмеченного участка
     * .carret('sel') - выдать позицию курсора, верхняя и нижняя граница отмеченного участка в массиве
     * .carret('set',X,Y)|| carret(X,Y)|| carret(X) - установить курсор в поззицию
     * .carret('is',X) - проверить, что курсор в позиции X (отмеченая область считается курсором)
     * @param act
     * @param selectionStart
     * @param selectionEnd
     */
    $.fn.carret=function(act,selectionStart, selectionEnd){
        var input=this[0];
        if(!input) return 0 ;
        // анализ параметров
        if(undefined==act){
            act='get';
        } else if(typeof(act)=="number"){
            selectionEnd=selectionStart;
            selectionStart=act;
            act='set';
        } 
        if(undefined==selectionEnd)
            selectionEnd=selectionStart;

        if(act=='set'){
            if (input.setSelectionRange) {
                input.focus();
                input.setSelectionRange(selectionStart, selectionEnd);
            }
            else if (input.createTextRange) {
                var range = input.createTextRange();
                range.collapse(true);
                range.moveEnd('character', selectionEnd);
                range.moveStart('character', selectionStart);
                range.select();
            }
            return this;
        } else {
            $(input).focus();
            var cursor=[];
            if(typeof(input.selectionStart)!='undefined'){
                cursor=[ input.selectionStart,input.selectionEnd];
            } else
            if (document.selection) {
                for(var i=0;i<2;i++){
                    var sel=document.selection.createRange();
                    var clone=sel.duplicate();
                    sel.collapse(0==i);
                    clone.moveToElementText(input);
                    clone.setEndPoint(0==i?'EndToStart':'EndToEnd',sel);
                    cursor[i]=clone.text.length;
                }
            }
            if(act=='is'){
                return cursor[0]<=selectionStart && selectionStart<=cursor[1];
            }else if(act=='sel'){
                return cursor;
            } else
                return cursor[0];
        }
    };

Это сообщение отредактировал(а) ksnk - 12.12.2015, 20:44

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

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

maxipub

Дата 10.12.2015, 11:53 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 517
Регистрация: 22.10.2009

Репутация: нет
Всего: 1

ksnk, спасибо большое за помощь! Порылся еще немного в теме. Решил в форме ничего не заменять, столько кода из-за такой мелочи...

maxipub

Дата 10.12.2015, 12:49 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 517
Регистрация: 22.10.2009

Репутация: нет
Всего: 1

В принципе, немного поэксперементировав, не такой уж и плохой плагин... Только не $(this).carret(x);, а $(this).carret('set', x);

Спасибо еще раз! smile

ksnk

Дата 12.12.2015, 20:51 (ссылка)

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

Загрузка ...

прохожий

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

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

Да, действительно, ошибка была. Так, оказывается, не проверял еще. Поправил

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

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

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