html の input type=number でmax min を指定しても手動で数字を入力されて min max 値をオーバーしてしまった時の対処方法

<input type=”number” min=”10″ max=”100″ step=”1″> と記述しても実際数字を手入力されると入力できてしまいます。これは面倒なので jQuery を使って mi n を下回ったら min 値を max を上回ったら max 値を自動で設定するスクリプトです。$(function(){ } の内部に記述すれば、どんなコードでも対応すると重ます。是非コピペして使って下さい。

	$('input[type="number"]').focusout(function() {
		if(typeof $(this).attr('min') !== "undefined" && parseInt($(this).val()) < parseInt($(this).attr('min')))
			$(this).val($(this).attr('min'));
		else if(typeof $(this).attr('max') !== "undefined" && parseInt($(this).val()) > parseInt($(this).attr('max')))
			$(this).val($(this).attr('max'));
		else if(typeof $(this).attr('min') !== "undefined" && $(this).val() === '')
			$(this).val($(this).attr('min'));
	});