jquery number 를 이용하여 숫자 3자리 마다 콤마(,) 찍기 > 개발

• 목록

• 페이스북 공유
• 트위터 공유

ㅁ 숫자 3자리마다 콤마(,) 찍기

asp 및 vbs 시절에는 formatnumber 라는 함수를 이용하여 숫자 3자리마다 콤마를 찍곤 하였다.
세상이 변하여 vbs 가 통하지 않는 시절이 되어 javascript 함수를 만들어 사용해야 하는 상황이 도래하였다. ^^


ㅁ jquery 로 구현

자바스크립트로 맨땅에 헤딩하기 보다는, jquery 나 jquery plugin 형태의 솔루션을 찾아 보았다.
역시나, 세상은 넓고 천재는 많다.
적용이 쉬워 보이는 jquery-number  를 이용해서 해당 기능을 구현해 보고자 한다.

https://github.com/teamdf/jquery-number

위 사이트에서 jquery-number 를 다운로드 받을 수 있다.
본인도 다운로드 기능을 찾지 못해 좀 해맸기 때문에 우려해서 말씀드리면, 오른쪽 아래에 Download Zip 이라는 버튼이 있다. ^^
그래도 못찾으시는 분들을 위해서 다운로드 링크를 남긴다. ㅡㅡ
https://github.com/teamdf/jquery-number/archive/master.zip

적용 소스는 간단하다.
우선, jQuery 는 1.6 이상이 필요하다.
jquery.number.js 나 jquery.number.min.js 둘 중에 하나를 삽입한다.
CDN 링크는 아래와 같다.
https://cdnjs.com/libraries/df-number-format/2.1.6

1. 기본적으로 소수점 이하는 없애고 천단위로 콤마를 찍는다.

$.number( 5020.2364 ); // Outputs 5,020

2. 소수점 이하를 표현하고자 한다면, 파라미터를 하나 더 넘겨 준다.

$.number( 5020.2364, 2 ); // Outputs: 5,020.24

3. input 박스나, innerhtml 태그에도 적용 가능하다.

$('input.number').number( true, 2 );
$('span.number').number( true, 2 );


** 참고 : 위 소스의 제작자는 DIGITAL FUSION 으로, 웹사이트는 다음과 같다.
http://www.teamdf.com/web/jquery-number-format-redux/196



====

자바스크립트로 한줄로 구현이 가능한 코드
[code]
function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
[/code]

** 출처:
http://fruitdev.tistory.com/160

추천0