furu07yu https://blog.hatena.ne.jp/furu07yu/ 行動すれば次の現実 https://furu07yu.hatenadiary.jp/ Javascript input要素に入力した数字を3桁ごとのカンマ区切りにして表示する方法を説明します。 本記事はReactをベースに実装例を記述していますが、考え方は他のフレームワークでも同じですので、Reactを使用していない方も参考になるかと思います。 input type属性は「tel」がおすすめ 実装に入る前に前提知識として抑えておいてほしいポイントがあります。 それはinput type属性による入力制御の違いです。 input type="number"を使用することで数字のみが入力できるようになります。 モバイルの場合も同様に、数字のキーボードが表示されますので、ユーザビリティ的には問題有りません… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ffuru07yu.hatenadiary.jp%2Fentry%2Finput-type-number-comma-separated" title="inputタグに入力した数字を3桁ごとのカンマ区切りにして表示する方法 - 行動すれば次の現実" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/f/furu07yu/20220715/20220715143544.png Hatena Blog https://hatena.blog 2022-07-15 14:40:34 rich https://furu07yu.hatenadiary.jp/entry/input-type-number-comma-separated 1.0 100%