Интересно

Обязательно стоит почитать популярные статьи блога.
Создаем vkontakte.ru публичную страницу для своего сайта Пейзажи апокалиптической Москвы Shortlinks | Короткие ссылки в wordpress 3 автоматически через сервиc bit.ly Отключаем рекламу vkontakte.ru Иконки в помощь веб-дизайнеру Добавляем произвольные поля в rss ленту
Блог про дизайн > Скрипты > Удобный ввод даты в поле на javascript

Удобный ввод даты в поле на javascript

Удобный ввод даты в поле на javascript

calendarscriptПри создании одного сайта заказчику понадобился скрипт, позволяющий двумя щелчками вставить дату в текстовое поле. После небольших изысканий в сети был найден достаточно легкий (6 кб, без сжатия) javascript. Результат его работы вы видите на картинке.
При щелчке в текстовом поле выскакивает календарь, который позволяет выбрать дату, после чего эта дата заноситься в текстовое поле.
Метод использования крайне прост. Перед использование подключаем файл.

<script src="/js/calendar.js"></script>

К полю, которое будет работать со скриптом дописываем.

onfocus="this.select();lcs(this)" onclick="event.cancelBubble=true;this.select();lcs(this)"

Наслаждаемся работой!
P.S. багов с различными видами браузеров не замечено.

Скачать скрипт удобного ввода даты в текстовое поле на javascript

Если вам понравилась статья, вы можете помочь блогу - сделайте ретвит записи или поделитесь ссылкой в сети, с помощью кнопок сверху. Спасибо! Если вы хотите регулряно получать обновление блога подпишитесь на обновления блога по RSS, Email или twitter!

Скрипты , , ,

  1. Читатель
    7 Июль 2010 в 19:23 | #1

    Веселенький календарик.

    Неделя начинается с воскресенья — как в штатах.

    Даты ранее текущей — не выбираются.

    Два поля ввода на одной странице — подглюкивает.

    В обчем, для изучения и написания своего календарика — подходит.

  2. Владимир
    30 Сентябрь 2011 в 17:39 | #2

    Действительно весёлый календарик. Переработал под себя:

    1) Неделя начинается с понедельника (cd=td.getDay(); заменяем на cd=td.getDay()-1;)

    2) Даты ранее текущей выбираются.

    getObj('v'+parseInt(d)).onmouseover=(dip)?null:cs_over;
    getObj('v'+parseInt(d)).onmouseout=(dip)?null:cs_out;
    getObj('v'+parseInt(d)).onclick=(dip)?null:cs_click;

    меняем на

    getObj('v'+parseInt(d)).onmouseover=cs_over;
    getObj('v'+parseInt(d)).onmouseout=cs_out;
    getObj('v'+parseInt(d)).onclick=cs_click;

    Может ещё что под себя сделаю. У кого будут вопросы — спрашивайте.

  3. Владимир
    12 Октябрь 2011 в 21:05 | #3

    @Владимир

    К 1-ому пункту ещё надо добавить

    if (-1===cd){

    cd=6;

    }