За последние 24 часа нас посетили 59753 программиста и 1771 робот. Сейчас ищут 843 программиста ...

глобальный хук для текстовых инпутов

Тема в разделе "JavaScript и AJAX", создана пользователем engager, 16 сен 2010.

  1. engager

    engager Активный пользователь

    С нами с:
    21 янв 2009
    Сообщения:
    1.106
    Симпатии:
    1
    хочу сделать централизованную проверку на длину вводимых данных на жаваскрипте.
    идея такая. при загрузке страницы грубо говоря привязать всем инпутам типа text и textarea событие keypress (или как там), и в обработчике сравнивать длину данных вызвавшего событие инпута с неким значением, и, в случае, если юзер перебрал, как-нить выделять инпут (красную рамку там или бэкграунд). для каждого инпута ограничение длины свое.
    с хуком все понятно. где бы хранить макс. длину? в каком аттрибуте?
    например, во многих фреймворках у базового класса есть свойство Tag.

    maxlength не предлагать - это уродство)) к тому же для textarea не актуально.
     
  2. Apple

    Apple Активный пользователь

    С нами с:
    13 янв 2007
    Сообщения:
    4.984
    Симпатии:
    2
    engager
    Нативно хочешь? Без фреймворков?
     
  3. Gromo

    Gromo Активный пользователь

    С нами с:
    24 май 2010
    Сообщения:
    2.786
    Симпатии:
    2
    Адрес:
    Ташкент
    можно сделать по другому - у каждого контроллируемого поля есть айди (соответственно уникальный).
    в javascript подгружаешь массив с ключами = айди инпутов, и значениями - макс.длинной поля.
    затем ищешь эти самые инпуты по ай-ди и добавляешь им функцию onkeypress, которая и сравнивает длину с необходимой.
    При превышении, к заданному элементу добавляешь класс 'input_max':
    [css]
    .input_max {
    border: solid 1px red;
    }
    [/css]
     
  4. engager

    engager Активный пользователь

    С нами с:
    21 янв 2009
    Сообщения:
    1.106
    Симпатии:
    1
    Apple
    ну в проекте участвует jQuery. куда ж без нее родной.
    у нее есть какие-то средства?
    Gromo
    угу, я про это я думал) это пока единственный вариант, который мне видится.
     
  5. Apple

    Apple Активный пользователь

    С нами с:
    13 янв 2007
    Сообщения:
    4.984
    Симпатии:
    2
    У неё очень много средств, поэтому уточни: input буду находится только внутри тега form или могут быть разбросаны абсолютно где угодно? Текстовые элементы собираются псевдо-селектором :text, указатель на ошибочный элемент есть обычный выбор $(this)
    Поэтому можно в любом случае каждому назначать аттрибут, например так:
    $(this).attr("maxlength") без проблем.

    Примерно так:

    [js]$(document).ready(function() {
    $(":text").change(function() {
    $(this).attr("maxlength");
    });
    });[/js]
     
  6. engager

    engager Активный пользователь

    С нами с:
    21 янв 2009
    Сообщения:
    1.106
    Симпатии:
    1
    Apple
    да эт все хорошо. вопрос не в этом.
    maxlength - он ведь ограничивает ввод? то есть, если maxlength = 40, то он только 40 символов и даст ввести.
    или я что-то путаю?
     
  7. Apple

    Apple Активный пользователь

    С нами с:
    13 янв 2007
    Сообщения:
    4.984
    Симпатии:
    2
    Дак вот об этом и речь, что есть встроенное свойство, которое не нарушает валидность документа.
    В поле вводим значение, которое, например, превышает допустимое ровно в двое.
    И к событие onchange крепим обработчик (см. выше), который сверяет длину поля с текстом и делит, например, на 2.
    Т.е пользователь ввел 40 символов и получил ошибку с JavaScript, хотя по факту мог БЫ ввести 80 и его не ограничивает ничего. Именно на это действие вешает toggleClass.

    Что касается textarea, то делаем буквально то же самое, только функцию прийдется вынести для унификации, и прикрепить к обоим. Вот и всё. Али я чего-то не понял?
     
  8. engager

    engager Активный пользователь

    С нами с:
    21 янв 2009
    Сообщения:
    1.106
    Симпатии:
    1
    Apple
    мм. неплохая идея) тханкс, так и сделаю.
    а то меня лично травмирует, когда инпут неожиданно "заканчивается" ))
    осталось придумать, что использовать в textarea вместо maxlength, ведь у него нет такого атрибута
     
  9. Apple

    Apple Активный пользователь

    С нами с:
    13 янв 2007
    Сообщения:
    4.984
    Симпатии:
    2
    Нет в спецификации =)
    Если действительно важно не нарушать валидность документа, то прийдется цеплять это свойство из JavaScript после загрузки, либо спрятать в name, например.
    Если валидность не так важна, то можно просто определить ему тоже атрибут maxlength.
    Кстати, если это будет сделано, то выборку можно производить именно по этому атрибуту через jQuery =)
     
  10. engager

    engager Активный пользователь

    С нами с:
    21 янв 2009
    Сообщения:
    1.106
    Симпатии:
    1
    угу, припоминаю, что юзал это свойство у тексэйрии)
    значит, оно недокументированное...
    можно вообще прилепить псевдоклассы типа
    .textfield {
    #decorations
    }
    .fld_len_30 {
    }

    <textarea = 'textfield fld_len_30' ...

    , и при загрузке это дело парсить. тогда валидность сохраниться. в общем тут уже дело фантазии)
     
  11. tenshi

    tenshi Активный пользователь

    С нами с:
    1 июн 2010
    Сообщения:
    191
    Симпатии:
    0
    добавить атрибут в доктайп - пара строк. не вижу проблем
     
  12. admyx

    admyx Активный пользователь

    С нами с:
    14 мар 2008
    Сообщения:
    2.159
    Симпатии:
    1