숫자 입력시에 컴마와 소수점 제어하기
<input type="text" name="number" class="mask-num decimal-2">
와 같이 input 에 클래스를 통해 컴마와 소수점을 제어합니다.
function numberFormat(number, decimals = 0, decPoint = '.', thousandsSep = ',') {
number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
let n = !isFinite(+number) ? 0 : +number;
let prec = !isFinite(+decimals) ? 0 : Math.abs(decimals);
function toFixedFix(n, prec) {
let k = Math.pow(10, prec);
return '' + Math.round(n * k) / k;
}
let s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
if (s[0].length > 3) {
s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, thousandsSep);
}
if ((s[1] || '').length < prec) {
s[1] = s[1] || '';
s[1] += new Array(prec - s[1].length + 1).join('0');
}
return s.join(decPoint);
}
document.addEventListener('DOMContentLoaded', function () {
document.querySelectorAll('input.mask-num').forEach(function(input) {
// 소수점 자릿수 설정: decimal-1, decimal-2 등의 클래스에서 숫자를 추출
const decimalMatch = input.className.match(/decimal-(\d+)/);
const decimalPlaces = decimalMatch ? parseInt(decimalMatch[1], 10) : 0;
// 초기 포맷 적용
input.value = numberFormat(input.value, decimalPlaces);
// 입력할 때마다 포맷 적용
input.addEventListener('input', function() {
input.value = numberFormat(input.value, decimalPlaces);
});
});
});
댓글 4개
감사합니다 ^^
유용하게 잘쓰겠습니다~감사합니다~
수고하셨습니다. 유용하게 사용될 수 있겠어요
감사합니다
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2455 |
|
1년 전 | 1118 | |
| 2454 | 1년 전 | 1054 | ||
| 2453 | 1년 전 | 1618 | ||
| 2452 | 1년 전 | 1152 | ||
| 2451 | 1년 전 | 955 | ||
| 2450 | 1년 전 | 1333 | ||
| 2449 | 1년 전 | 881 | ||
| 2448 | 1년 전 | 1332 | ||
| 2447 | 1년 전 | 1410 | ||
| 2446 | 1년 전 | 1125 | ||
| 2445 | 1년 전 | 1281 | ||
| 2444 | 1년 전 | 1674 | ||
| 2443 | 1년 전 | 1484 | ||
| 2442 | 1년 전 | 1070 | ||
| 2441 | 1년 전 | 1177 | ||
| 2440 | 1년 전 | 4619 | ||
| 2439 | 1년 전 | 1075 | ||
| 2438 | 1년 전 | 1115 | ||
| 2437 | 1년 전 | 925 | ||
| 2436 | 1년 전 | 1559 | ||
| 2435 | 1년 전 | 1453 | ||
| 2434 | 1년 전 | 1016 | ||
| 2433 |
|
1년 전 | 613263 | |
| 2432 |
|
1년 전 | 1091 | |
| 2431 |
|
1년 전 | 1705 | |
| 2430 | 1년 전 | 1310 | ||
| 2429 | 1년 전 | 1269 | ||
| 2428 | 1년 전 | 1145 | ||
| 2427 | 1년 전 | 1108 | ||
| 2426 |
뽕엄능브라
|
1년 전 | 1229 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기