<h2>숫자 입력 사용성</h2>
<label for="numberInput">금액 입력:</label>
<input type="number" id="numberInput" value="150100" style="text-align: right" oninput="updateNumberDisplays()" step="100" onclick="this.select()">원
<p>한국어로 변환된 숫자: <b id="koreanOutput"></b></p>
<p>쉼표가 찍힌 숫자: <b id="commaOutput"></b></p>
function updateNumberDisplays() {
var number = document.getElementById("numberInput").value;
var koreanNumber = convertNumberToKoreanText(number);
document.getElementById("koreanOutput").innerText = koreanNumber + "원";
document.getElementById("commaOutput").innerText = formatNumberWithCommas(number) + "원";
}
function convertNumberToKoreanText(number) {
const units = ['','만','억','조','경'];
let unit = 10000;
let result = '';
let unitIndex = 0;
if(number == 0) return '영';
while(number > 0) {
let temp = number % unit;
if(temp > 0) {
let unitName = units[unitIndex];
result = temp + unitName + " " + result;
}
number = Math.floor(number / unit);
unitIndex++;
}
return result.trim();
}
function formatNumberWithCommas(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
updateNumberDisplays();
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.