数値項目を入力してもらうINPUT TYPE=TEXTの要素、前0入力を抑制したい

Question

現況は当該要素に数値項目のみ入力可能なよう以下コーディング（JQuery）となっています。

こちらについても支援を仰ぎまして達成したもので、標題の件を達成する上での
応用能力がなくお問合せさせて頂きました。

そもそも数値項目の入力制御、皆さんどうされているのですか。質問主旨から離れてしまいますが。
皆さんが必要と思う機能だと思うのですが．．．
毛嫌いしているフレームワークで作れば（CAKEPHP理解できず断念）　こういったUIの問題も解消されるのかな

<tr>
	<td style="width: 9%;"><input type="hidden" name="rsvno"><button class="cdsrch" type="button"><img src="img/検索.png"></button><input type="text" name="cd[]" style="width: 64%; ime-mode: inactive;" /></td>
	<td style="width: 31%;"><input type="text" name="name[]" style="width: 100%;" readonly /></td>
	<td style="width: 15%;"><input type="text" name="capa[]" style="width: 100%;" readonly /></td>
	<td style="width: 12%;"><button class="lotsrch" type="button"><img src="img/検索.png"></button><input type="text" name="lot[]" style="width: 75%; ime-mode: inactive;" /></td>
	<td style="width: 7%;"><input type="text" name="reqrsv[]" style="width: 92%; ime-mode: inactive;" /></td>
	<td style="width: 8%;"><input type="text" name="custockl[]" style="width: 95%;" readonly /></td>
	<td style="width: 10%;"><input type="text" name="custocka[]" style="width: 95%;" readonly /></td>
	<td style="width: 2%;"><span class="errmark" style="width: 100%;"></span></td>
	<td style="width: 3%;"><button class="rowins" type="button" style="width: 100%;">＋</button></td>
	<td style="width: 3%;"><button class="rowdel" type="button" style="width: 100%;">－</button></td>
</tr>

$("[name='reqrsv[]']").on({
		"keydown": function(e) {
			var k = e.keyCode;
			if (!(k >= 48 && k <= 57 || k >= 96 && k <= 105 || k == 32 || k == 8 || k == 9 || k == 46 || k == 39 || k == 37)) {
				return false;
			}
		},
   		"blur": function() {
			var num = $(this).val();
			num = num.replace(/(\d)(?=(\d\d\d)+$)/g, "$1,");
			$(this).val(num);
    		},
		"focus": function(e) {
			var num = $(this).val();
			num = num.replace(/,/g, "");
			$(this).val(num);
			if (this.selectionStart != null) {
				this.selectionStart = this.selectionEnd = this.value.length;
			} else {
				this.createTextRange().select();
			}
		}
	});

Answer 1

そもそも数値項目の入力制御、皆さんどうされているのですか

<input type="number">でだいたい済ませていますが、何かこれでは不足なのでしょうか。

Comments

[saya24]

ご見解ありがとうございます、早速試しました。

当方の掲載したコーディングですが、どこかの掲示板でカンマ付けを都合よく対応するには？という問合せをしてこうなった可能性がありますね。

type=numberは、入力して当該要素からフォーカスが外れたとき、カンマ表示をしてくれないのですよね？？
自分が採用しているコーディングをよく解読できませんが、フォーカスしたときはカンマを逆に取り除くことをやっている気がします。（空に修整した場合「,」が残るからかな？？）

[maisumakun]

はい、カンマが入るときにはtype=numberは向かないですね。

[saya24]

了解しました。
採用しているコーディングの意味合い、背景をあとから思い出して皆様の貴重なお時間を頂いてしまいました。
となると、【前０除去】は、このコーディング内で対応せざるを得ない、ということですかね？？数値のみの入力を達成しつつ、カンマ表示を達成したい場合は

[saya24]

ベストな方針か分かりませんが自己解決しました。
数値項目入力枠を、カンマ表示を達成しつつ前0入力は抑制する手段、（相応のライブラリ利用しない場合）
解決方法のところに入力しました．．．

Answer 2

導入部分としてtype=numberは有用ですし、pattern属性もありだと思います。

ただいずれにしてもクライアントサイドである以上は改ざんが可能なので、
サーバーサイドでのチェックを行います。

Answer 3

$("[name='reqrsv[]']").on("change",function() {
	var valbyte = $(this).val().length;
	var newval = $(this).val();
	for (var i = 1; i <= valbyte; i++) {
		if (newval.substr(0,1) == 0) {
			newval = newval.substr(1);
		} else {
			break;
		}
	}
	$(this).val(newval);
});