Скрипт input плюс минус

Увеличение и уменьшения числового значения в input нажатием на кнопки плюс и минус.

1. Способ type=»number»

Самый простой указать type=»number», но этот способ не все браузеры поддерживают, и в этом случае невозможно стилизация.

<input type="number" value="1"/>

2. Способ используя jquery

Надо создать блок с кнопочками навигации и самим input. При необходимость символы плюса и минуса можно заменить на любые стилизированные элементы.

	<div class="number">
		<span class="minus">-</span>
		<input type="text" value="1"/>
		<span class="plus">+</span>
	</div>

получиться

В шапке прописать обращение к jquery

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

и вставить код для управления значениями в input

	$(document).ready(function() {
		$('.minus').click(function () {
			var $input = $(this).parent().find('input');
			var count = parseInt($input.val()) - 1;
			count = count < 1 ? 1 : count;
			$input.val(count);
			$input.change();
			return false;
		});
		$('.plus').click(function () {
			var $input = $(this).parent().find('input');
			$input.val(parseInt($input.val()) + 1);
			$input.change();
			return false;
		});
	});

Прикрепленный файл: example.rar (32.04 Kb)