Jquery ограничить поля DOB числами

Question

Есть ли плагин для полей DOB, который ограничивает каждое поле только цифрами и ниже определенной цифры. например у меня есть поля ДД / ММ / ГГГГ

Мне нужно, чтобы первое поле принимало только числа до 31 (нет 32, нет 62 и т. Д.), Второе поле, чтобы принимать числа не больше 12, и последнее, чтобы принимать любые числа.

Спасибо за любую помощь.

Очень признателен.

Answer 1

Нет 100% беспроблемного решения того, что вы хотите сделать. Проблема в том, что текстовые поля предназначены для ввода любого текста. Когда вы пытаетесь переопределить поведение, вы можете переопределить его только частично и по-разному в разных браузерах.

Здесь много сложных вопросов. Во-первых, что если кто-то поставит недопустимую дату, например, 29 февраля в не високосный год.

Кроме того, где вы связываете свои правила проверки? Если вы сделаете это в keyup, персонаж войдет в игру, затем вы подтвердите и удалите его. Если вы делаете это при нажатии клавиш, вы должны попытаться предотвратить поведение по умолчанию, а затем заменить его своей собственной логикой. Что делать, если кто-то вставит правой кнопкой мыши неверный номер?

Лично я бы использовал стиль html-5 <input type="date" /> что позволяет людям с современными браузерами воспользоваться преимуществами лучшей проверки ввода, не вызывая потенциальных проблем с необычными браузерами / обстоятельствами.

Я думаю, что лучше проверить после того, как дата была отправлена, или, возможно, на вводе даты теряет фокус, а не пытаться заблокировать ввод.

Answer 2

Вместо этого вы можете попробовать проверить пользовательский ввод, используя vanilla JavaScript. Что-то в этом роде - не 100% пуленепробиваемое, но близкое:

function dateValidate(userDate) {
  if (/^\d+\/\d+\/\d+$/.test(userDate) == false) {
    return false;
  }
  var datePart = userDate.split("/");
  datePart[0] = parseInt(datePart[0], 10);
  datePart[1] = parseInt(datePart[1], 10);
  datePart[2] = parseInt(datePart[2], 10);
  var testDate = new Date(datePart[2], datePart[1] - 1, datePart[0]);
  if (testDate.getDate() != datePart[0] || testDate.getMonth() + 1 != datePart[1] || testDate.getFullYear() != datePart[2]) {
    return false;
  }
  return testDate;
}
console.log(dateValidate("8/9/1980"));   // my birthday test   [PASS]
console.log(dateValidate("08/09/1980")); // leading zeros test [PASS]
console.log(dateValidate("8/31/1980"));  // date overflow test [PASS -- returns false]
console.log(dateValidate("29/2/1980"));  // leap year test     [PASS]
console.log(dateValidate("29/2/1981"));  // leap year test     [PASS -- returns false]

Answer 3

Вероятно, полезно знать, что это называется "проверка".

Вот, пожалуйста. На этой странице есть демонстрационная версия, которую вы можете использовать для тестирования плагина, чтобы убедиться, что он делает то, что вам нужно.

И этот метод называет себя "лучшей" проверкой даты, потому что он не только проверяет 1–12, 1–31 и т. Д., Но также проверяет, что дата является допустимой датой (не 29 февраля в неправильный год).