Плюс и минус для поля input

Небольшой скрипт на jQuery, который при нажатии на соотвествующую кнопку, прибавляет и отнимает единичку в текстовом поле.

Также в этой теме есть несколько вариантов оформления этих кнопок.

Пример:

(вид немного отличается из-за стилей сайта)

HTML:

Где атрибут data-max-count - максимальное значение.

jQuery:

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

Оформление:

Во всех примерах используется jQuery приведенный выше

Предыдущий вариант с кнопкой купить:

Смотрите также:

Добавить комментарий:

Ваш комментарий отправлен!

Комментарии:

  • EvilDoom:

    А если в инпуте по умолчанию стоит 0. При нажатии на + появляется 1, а после нажимаем на — должен вернуться 0. Что в скрипте нужно поменять?

    Ответить
    • Alexander:
      count = count < 1 ? 1 : count;
      this.value = 1;

      1 заменить на 0

      Ответить
  • SylaR:

    Красота, но только что получил *** от ментора за подобный подход

    Ответить
  • squid:

    // Убираем все лишнее и невозможное при изменении поля
    Лишнее. Достаточно <input disabled…

    Ответить
    • Alexander:

      А если нужно ввести 100 штук?

      Ответить
  • Павел:

    у кого +,- отправляют форму добавьте к <button> type="button"

    Ответить