カウントみたいなもの

Question

ローカルストレージを使って、カウント（ポチポチ）みたいなものを作っています。

	<div>
		上限:
		<input class="text" id="classes" type="text" value="15"/>
		<span id="ok"><input type="button" value="決定" id="decisionbtn" /></span>
	</div>
	<input type="button" value="+" id="mon1" />:<input type="button" value="-" id="re_mon1"/>
	<div id="count_mon1"></div>

$(function count(){
	//上限呼び出し
		if(localStorage.getItem('key_upperlimit')) { 
		$('#classes').val(localStorage.getItem('key_upperlimit')); 
		var upperlimit = $("input[id='classes']").val();
	}
	//カウント回数呼び出し
	if(localStorage.getItem('key_count')) { 	
		$("#count_mon1").text(localStorage.getItem('key_count'));
	}
	
	
	$("#decisionbtn").click(function(){
	//保存
		localStorage.setItem("key_upperlimit", $('#classes').val());
		location.reload();
	});
	
	//プラスボタンボタンの処理
	var click_count_mon1 = localStorage.getItem('key_count');
		$("#mon1").click(function(){
			if(0 <= click_count_mon1 && click_count_mon1 < upperlimit)  {
				click_count_mon1++;
				//保存
				localStorage.setItem("key_count", click_count_mon1);
				
			}
			
			//呼び出し
			if(localStorage.getItem('key_count')) { 
				click_count_mon1 = localStorage.getItem('key_count');
				$("#count_mon1").text(localStorage.getItem('key_count'));
			}
		});
		
		//マイナスボタンの処理
			$("#re_mon1").click(function(){
				if(0 < click_count_mon1 && click_count_mon1 <= upperlimit){
					click_count_mon1--;
					//保存
					localStorage.setItem("key_count", click_count_mon1);
				}
				
				//呼び出し
				if(localStorage.getItem('key_count')) { 
					click_count_mon1 = localStorage.getItem('key_count');
					$("#count_mon1").text(localStorage.getItem('key_count'));
				}
			});	
});

上のコードだと、上限を設定して+-ボタンを押すとカウントが『2』で動かなくなります。
デベロッパーツールで『10』以上を入力すると設定した上限まで増減します。
しかし、『9』になった時点で動かなくなります。

正常に動かすにはどのように訂正すればいいのでしょうか？

Answer 1

こんにちは。

10と指定した場合にカウントが9で止まってしまうのは、

if (0 <= click_count_mon1 && click_count_mon1 < upperlimit) {

で、「click_count_mon1 が upperlimit より小さい(upperlimit を含まない)」と条件指定しているからです。

また、localStorage にテキストで保存しているので、
数値の比較ではなく、文字列の比較になってしまい、1文字目で比較されてしまっているためだと思います。

15
2
↑ こうなっているため、1と2を比較しています。

比較する前に文字列→数値にして比較すれば解決すると思いますよ。