全角数字から半角数字へ変換

コード例 - Sample

HTML

<div class="example-sample">
 <input type="text" id="in1" maxlength="20">
 <input type="button" id="bt1" value="変換">
</div>

CSS

<style>
.example-sample{
 display: flex;
}
.example-sample>[type="text"]{
 display: block;
 width: 20rem;
 font-size: 0.9rem;
 line-height: 1em;
 background-color: #e5e5e5;
 border: 1px solid #000;
}
.example-sample>[type="button"]{
 margin-left: 15px;
 padding: 0 10px;
}
</style>

JavaScript

<script>
//ボタンクリックでイベント動作
document.getElementById('bt1').addEventListener('click', function(){
 //入力文字を変数に格納
 let e1 = document.getElementById('in1').value;

 //正規表現で全文字を「0-9０-９」の文字列以外を空文字に置き換え
 let e2 = e1.replace(/[^0-9０-９]/g, '');

 //入力された全角数字全文字を半角に置き換え
 let e3 = e2.replace(/[０-９]/g, function(s){
  let e31 = s.charCodeAt(0); //UTF-16コードをあらわす整数を取得
  let e32 = e31 - 0xFEE0; //上記で取得した整数から「0xFEE0」を引く
   //※頭の「0x」は16進数を示す文字列で、3文字目以降のFEE0（16進数）を10進数にすると65248
  return String.fromCharCode(e32); //上記で取得した整数を文字に変換
 });

 //「innerText」で出力
 document.getElementById('in1').value = e3;
});
</script>