자연수 컴마처리 및 여분필드(input) 연계
자연수의 컴마처리 관련 함수를 자바스크립트로 만들어 보았습니다.
이 함수를 만든 이유는 3단위(천단위) 이외의 2단위(백단위) 나 4단위(만단위) 등도 자유롭게 하기 위함입니다.
[code]
<script>
function commaInt(...n) {
comma = n[0];
stringInt = n[1];
stringInt = String(stringInt).replaceAll(",", "").split("");
for (i in stringInt) stringInt[i] = i != 0 && (stringInt.length - i) % Number(comma) == 0 ? "," + stringInt[i] : stringInt[i];
return stringInt.join("");
}
</script>
[/code]
예를 들어
commaInt(3, 1234567);
commaInt(3, "1234567");
commaInt(3, "1,23,45,67");
는 모두 1,234,567 를 리턴합니다. 또한 여기서 앞숫자 3을 4로 바꾸면 4단위(만단위) 컴마가 찍히구요.
자연수로 만들려면 위에서 추출된 것은 모두 문자열이므로 앞숫자를 0으로 바꾼후 숫자화 해 주세요.
Number(commaInt(0, "1,234,567"))
결과 숫자 1234567
예제는 2개인데 https://wittazzurri.com/editor/html_editor.php 에서 확인해보세요.
먼저 버튼처리하는 경우입니다.
[code]
<input id="wr_1" value="1234567">
<br>
<input id="wr_2" value="2345678">
<br>
<input id="wr_3" value="3456789">
<br>
<input id="wr_4">
<br>
<button id="wr_btn" type="button" style="cursor:pointer">클릭</button>
<script>
function commaInt(...n) {
comma = n[0];
stringInt = n[1];
stringInt = String(stringInt).replaceAll(",", "").split("");
for (i in stringInt) stringInt[i] = i != 0 && (stringInt.length - i) % Number(comma) == 0 ? "," + stringInt[i] : stringInt[i];
return stringInt.join("");
}
wr_1.value = commaInt(3, wr_1.value);
wr_2.value = commaInt(3, wr_2.value);
wr_3.value = commaInt(3, wr_3.value);
function commaResult() {
wr_4.value = Number(commaInt(0, wr_1.value)) + Number(commaInt(0, wr_2.value)) + Number(commaInt(0, wr_3.value));
wr_4.value = commaInt(3, wr_4.value);
}
wr_btn.onclick = commaResult;
</script>
[/code]
다음은 웹로딩시 바로 나타나는 경우입니다.
[code]
<input id="wr_1" value="1234567">
<br>
<input id="wr_2" value="2345678">
<br>
<input id="wr_3" value="3456789">
<br>
<input id="wr_4">
<script>
function commaInt(...n) {
comma = n[0];
stringInt = n[1];
stringInt = String(stringInt).replaceAll(",", "").split("");
for (i in stringInt) stringInt[i] = i != 0 && (stringInt.length - i) % Number(comma) == 0 ? "," + stringInt[i] : stringInt[i];
return stringInt.join("");
}
wr_1.value = commaInt(3, wr_1.value);
wr_2.value = commaInt(3, wr_2.value);
wr_3.value = commaInt(3, wr_3.value);
function commaResult() {
wr_4.value = Number(commaInt(0, wr_1.value)) + Number(commaInt(0, wr_2.value)) + Number(commaInt(0, wr_3.value));
wr_4.value = commaInt(3, wr_4.value);
}
commaResult();
</script>
[/code]
여분필드로 날릴 때는 여분필드 입력시 숫자와 컴마 이외에는 입력하지 못하도록
input 에 onkeyup 이벤트 등을 다듬어 주거나 type를 아예 number 로 주세요.^^
댓글 10개
간단한건 저는 아래처럼 그냥 사용해요
Number(123456).toLocaleString('en');//123,456
천단위 소스야 널린게 천지이지만
가령 만단위로 찍을 땐 어찌하시려구요?
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 | 3년 전 | 4402 | ||
| 2664 |
선택과집중
|
4개월 전 | 572 | |
| 2663 |
|
4개월 전 | 619 | |
| 2662 |
|
4개월 전 | 574 | |
| 2661 |
선택과집중
|
4개월 전 | 508 | |
| 2660 | 4개월 전 | 588 | ||
| 2659 |
Modify
|
4개월 전 | 653 | |
| 2658 |
선택과집중
|
4개월 전 | 415 | |
| 2657 | 4개월 전 | 452 | ||
| 2656 |
|
4개월 전 | 964 | |
| 2655 |
선택과집중
|
4개월 전 | 549 | |
| 2654 | 5개월 전 | 403 | ||
| 2653 |
선택과집중
|
5개월 전 | 585 | |
| 2652 | 5개월 전 | 394 | ||
| 2651 | 5개월 전 | 446 | ||
| 2650 |
선택과집중
|
5개월 전 | 327 | |
| 2649 |
선택과집중
|
5개월 전 | 423 | |
| 2648 | 5개월 전 | 441 | ||
| 2647 |
welcome
|
5개월 전 | 545 | |
| 2646 |
디지털홍익인간
|
5개월 전 | 453 | |
| 2645 | 5개월 전 | 467 | ||
| 2644 |
선택과집중
|
5개월 전 | 512 | |
| 2643 | 5개월 전 | 456 | ||
| 2642 | 5개월 전 | 372 | ||
| 2641 | 5개월 전 | 358 | ||
| 2640 | 5개월 전 | 394 | ||
| 2639 | 5개월 전 | 1358 | ||
| 2638 |
|
5개월 전 | 511 | |
| 2637 |
세르반데스
|
5개월 전 | 398 | |
| 2636 |
선택과집중
|
5개월 전 | 568 | |
| 2635 |
선택과집중
|
6개월 전 | 682 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기