Javascript: настроить дату в текстовом поле с помощью события нажатия клавиши - PullRequest
Новая
       11

Javascript: настроить дату в текстовом поле с помощью события нажатия клавиши

0 голосов
/ 01 октября 2009

У меня есть стандартное текстовое поле <input>, где пользователи вводят дату. Я хотел бы добавить некоторые функции, где пользователи могут вводить + или -, чтобы добавить / вычесть день из значения. Я добавил событие onkeypress, которое вызывает эту функцию: 

function adjustDate( element ) {
    var e = event || window.event;
    var code = e.charCode || e.keyCode;

    switch( code ) {
        case 43: // user pressed "+" (plus)
            if( isDate( element.value ) ) {
                var d = new Date();
                d.getDate( element.value );

                d.setDate( d.getDate() + 1 );
                element.value = ( d.getMonth() + 1 ) + "/" + d.getDate() + "/" + d.getYear();
            } else {
                var today = new Date();
                element.value = ( today.getMonth() + 1 ) + "/" + today.getDate() + "/" + today.getYear();
            }

            if( e.preventDefault ) e.preventDefault();
            else e.returnValue = false;
            return false;

            element.select();

            break;
        case 45: // user pressed "-" (minus)
            // ...
   }
}

Функция isDate, которую я вытащил из Google и работает, но я также могу опубликовать ее при необходимости.

Моя проблема - работает один раз, потом нада. Например, если значение текстового поля равно 10/1/2009, то нажатие + сделает его 10/2/2009, но не повлияет на последующие плюсы. Затем, если я нажму -, он перейдет к 9/30/2009 вместо возврата к 10/1/2009 и проигнорирует последующие нажатия клавиш минус.

Я тестирую на IE8. Это внутреннее веб-приложение, поэтому другие браузеры были бы хорошими, но не обязательно обязательными. В настоящее время я не использую jQuery или какой-либо другой фреймворк, и для этого, вероятно, было бы излишним, поэтому я ищу чистое решение Javascript. На самом деле, эта функция - просто «приятно иметь», а не то, на что мне нужно тратить гораздо больше времени.

Я знаю, что либо что-то упустил, либо делаю это совершенно неправильно. Так что это?

Ответы [ 3 ]

1 голос
/ 01 октября 2009

Вам нужно изменить 

var d = new Date();

до 

var d = new Date(element.value);

и избавиться от 

d.getDate( element.value );

Вам также нужно переместить return false; после строки element.select().

0 голосов
/ 01 октября 2009

Метод getDate () в вашем примере не принимает параметр. Возвращает день месяца. Поэтому попробуйте назначить текущее значение даты в конструкторе.

Дайте попробовать: 

if( isDate( element.value ) ) {
  var d = new Date( element.value );
  d.setDate( d.getDate() + 1 );
  element.value = d.toDateString();
} else {
  element.value = new Date().toDateString();
}

Также обратите внимание на страницу w3c , которая содержит полезные методы, которые вы можете рассмотреть.

0 голосов
/ 01 октября 2009

Похоже, здесь просто ошибочная логика: 

var d = new Date();

d.getDate( element.value ); // HERE: what is this suppose to do?

d.setDate( d.getDate() + 1 );
element.value = ( d.getMonth() + 1 ) + "/" + d.getDate() + "/" + d.getYear();

Вы в основном устанавливаете element.value на завтра каждый раз.

...