시작페이지로 즐겨찾기추가
로그인
회원가입 l 출석체크 l 마이페이지 l CGIMALL
happycgi
자료실 사이트등록 랭킹100 프로그램리뷰 관리자추천자료 초보가이드
커뮤니티
전체 펼쳐보기
퀵메뉴링크 jquery , CSS , PHP , Javascript , 무료폰트 , ASP
상세검색
 > JAVASCRIPT > javascript 소스창고 > 제네레이터 > jQuery 를 이용한 Table 을 Excel 로 다운로드하는 플러그인 입니다. 상세정보
사이트등록
클라우드태그
javascript
php
html
CSS
mysql
ASP
jquery
메뉴
image
slide
Mobile
게시판
zoom
현재접속자 새로고침
jQuery 를 이용한 Table 을 Excel 로 다운로드하는 플러그인 입니다.
소스통계정보 오류신고 및 문의
해피팀
네티즌
트위터로 보내기 페이스북으로 보내기
소스분류 제네레이터
다운로드 횟수 89 회
간단설명 table2excel을 이용하여 테이블 데이터를 엑셀화 할 수 있습니다.
평가하기 훌륭함 매우좋음 좋음 괜찮음 보통 별로
홈페이지바로가기 소스다운로드 데모 미리보기가 없습니다 스크랩하기

문서내에 존재하는 테이블의 데이터를 엑셀화하여 저장할 수 있습니다.

jQuery Plugin 이며, 라이센스는 MIT 입니다.


소스다운을 누르시면 압축 파일을 다운로드 받을 수 있습니다.

압축 해제하셔서 폴더로 들어가면 demo 폴더가 있습니다.

index.html 파일은 원본파일이며, happy.html 은 제가 임의로 가공한 파일 입니다.

심플한 코드를 보고 싶다면 happy.html 을 보십시요.


사용법은 매우 심플 합니다.


1. 라이브러리를 호출하세요.
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="../dist/jquery.table2excel.js"></script>



2. 엑셀로 만들 데이터의 테이블을 만들어 주시되 class 명은 맞춰주셔야 합니다.
<table class="table2excel" data-tableName="Test Table 1">
<tr>
    <td>번호</td>
    <td>이름</td>
    <td>전화번호</td>
    <td>배송지</td>
    <td>주문번호</td>
    <td>배송메모</td>        
</tr>
<tr>
    <td>1</td>
    <td>홍길동1</td>
    <td>010-1111-1111</td>
    <td>대구 달서구 두류동 776-1</td>
    <td>N-192858291-D9S8</td>
    <td>문앞에 두시고 문자 주세요.</td>        
</tr>
<tr>
    <td>2</td>
    <td>홍길동2</td>
    <td>010-2222-2222</td>
    <td>대구 달서구 두류동 776-22</td>
    <td>N-195682958782-01-du29</td>
    <td>경비실로 .... ^^</td>        
</tr>
<tr>
    <td>3</td>
    <td>홍달래</td>
    <td>010-777-7777</td>
    <td>대구 달서구 두류동 722-1</td>
    <td>N-192858291-D9S8</td>
    <td>저녁 10시에 배송해주세요. 그 외의 시간엔 안 받습니다. </td>        
</tr>    
</table >

<button class="exportToExcel">Export to XLS</button>



3. 버튼을 클릭하면 실행될 플러그인 실행하는 코드를 추가하세요.
$("exportToExcel").click(function(e){
    $("#yourHtmTable").table2excel({
        exclude: ".excludeThisClass",
        name: "Worksheet Name",
        filename: "SomeFile.xls", // do include extension
        preserveColors: false // set to true if you want background colors and font colors preserved
});



사용하기도 편리하구요.

결과물도 나름 괜찮습니다. ^^






네티즌 의견   이용하신 자료의 후기를 자유롭게 작성하세요. (상업적인 광고 및 도배성 글 등은 사전통보없이 삭제될 수 있습니다.)
내용 아이디 의견남기기
감사합니다
2022-06-07 17:07:38
이서준
찬성 2
반대 2
1
이름
내용
:네맞아요: :화나는군요: :잠와: :우울해: :이건아냐: :왕하하: 왕웃음~ 놀램~
평가하기 훌륭함 매우좋음 좋음 괜찮음 보통 별로
도배방지키
 55711894 보이는 도배방지키를 입력하세요.