jquery를 사용하여 HTML 테이블의 열 순서 변경

mpsbhat

이 바이올린 에는 다음 과 같이 생성되는 html 테이블 있습니다.

<table width="100%" border="1" cellpadding="0" cellspacing="0">
    <tr>
        <th>Sl.No</th>
        <th>Name</th>
        <th>Dec 2013</th>
        <th>Feb 2014</th>
        <th>Jan 2014</th>
        <th>Mar 2014</th>
        <th>Nov 2013</th>
        <th>Total</th>
    </tr>
    <tr>
        <td>1</td>
        <td>foo</td>
        <td>4</td>
        <td>7</td>
        <td>3</td>
        <td>5</td>
        <td>2</td>
        <td>21</td>
    </tr>
    <tr>
        <td>2</td>
        <td>bar</td>
        <td>6</td>
        <td>1</td>
        <td>5</td>
        <td>8</td>
        <td>3</td>
        <td>23</td>
    </tr>
</table>

새 테이블의 열 순서가되도록 jquery를 사용하여 열을 재정렬하는 방법 Sl.No, Name, Nov 2013, Dec 2013, Jan 2014, Feb 2014, Mar 2014, Total또한 날짜 선택 ( FromTo날짜)을 기반으로 서버에 의해 월 열이 동적으로 생성됩니다.

찾으시는 주소가 없습니다
var arr = $('th').sort(function(a, b) {
   return new Date(a.innerHTML) > new Date(b.innerHTML);
}).map(function() { return this.cellIndex }).get();

$('tr').each(function() {
    $(this.cells).sort(function(a, b) {
        a = $.inArray(a.cellIndex, arr);
        b = $.inArray(b.cellIndex, arr);
        return a > b;
    }).prependTo(this);
});

http://jsfiddle.net/ZR5W7/

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

PHP를 사용하여 MySQL 쿼리에서 생성 된 html 테이블 열의 값 변경

분류에서Dev

javascript를 사용하여 html 테이블의 열 색상을 변경하는 방법

분류에서Dev

jQuery를 사용하여 HTML 테이블에서 동적으로 열 선택

분류에서Dev

jquery에서 열을 사용하여 테이블 순서 설정

분류에서Dev

VB.net을 사용하여 MySQL에서 테이블의 열 이름 변경

분류에서Dev

VB.net을 사용하여 MySQL에서 테이블의 열 이름 변경

분류에서Dev

jQuery를 사용하여 순서 배열에 따라 테이블의 tr을 재정렬하십시오.

분류에서Dev

CSS를 사용하여 HTML 요소 순서 변경

분류에서Dev

HTML 테이블에서 행 사이의 테두리를 숨기고 CSS를 사용하여 열 사이의 테두리 만 표시하는 방법

분류에서Dev

CSS를 사용하여 모바일에서 누적 열의 순서를 변경하는 방법

분류에서Dev

JQuery를 사용하여 div의 순서를 변경하는 방법

분류에서Dev

perl을 사용하여 html에서 순서대로 인덱스 페이지 번호를 변경하는 방법

분류에서Dev

JS forEach를 사용하여 다차원 배열을 HTML 테이블로 변환

분류에서Dev

jquery를 사용하여 HTML에서 태그 내부의 텍스트 값 변경

분류에서Dev

jQuery 또는 Javascript를 사용하여 객체 배열을 HTML 테이블로 변환

분류에서Dev

트리거를 사용하여 매개 변수가있는 다른 테이블에서 열이 업데이트 될 때 한 테이블의 열 업데이트

분류에서Dev

html css를 사용하여 모바일 장치에서 테이블 구조를 변경할 수 있습니까?

분류에서Dev

JavaScript를 사용하여 세 번째 열에서 HTML 테이블 검색

분류에서Dev

jQuery를 사용하여 테이블에서 동적으로 행 범위 변경

분류에서Dev

SQLAlchemy를 사용하여 LEFT JOIN 절에서 테이블 순서를 변경하는 방법

분류에서Dev

Html 테이블에서 jquery를 사용하여 값 바꾸기

분류에서Dev

jQuery를 사용하여 테이블에서 배열 만들기

분류에서Dev

Dplyr를 사용하여 그룹의 최대 값을 찾고 동일한 테이블의 다른 열에서 결과를 변경합니다.

분류에서Dev

JavaScript 및 jQuery를 사용하여 HTML tbody 테이블의 모든 행에서 첫 번째 열의 값을 덮어 쓰는 방법은 무엇입니까?

분류에서Dev

Tampermonkey를 사용하여 HTML에서 클래스 이름 변경

분류에서Dev

ReactJS를 사용하여 목록의 항목 순서 변경

분류에서Dev

CoreData 및 SwiftUI를 사용하여 To Many 항목의 순서 변경

분류에서Dev

xslt를 사용하여 json의 순서 변경

분류에서Dev

BeautifulSoup을 사용하여 HTML 테이블에서 하나의 열 스크래핑

Related 관련 기사

  1. 1

    PHP를 사용하여 MySQL 쿼리에서 생성 된 html 테이블 열의 값 변경

  2. 2

    javascript를 사용하여 html 테이블의 열 색상을 변경하는 방법

  3. 3

    jQuery를 사용하여 HTML 테이블에서 동적으로 열 선택

  4. 4

    jquery에서 열을 사용하여 테이블 순서 설정

  5. 5

    VB.net을 사용하여 MySQL에서 테이블의 열 이름 변경

  6. 6

    VB.net을 사용하여 MySQL에서 테이블의 열 이름 변경

  7. 7

    jQuery를 사용하여 순서 배열에 따라 테이블의 tr을 재정렬하십시오.

  8. 8

    CSS를 사용하여 HTML 요소 순서 변경

  9. 9

    HTML 테이블에서 행 사이의 테두리를 숨기고 CSS를 사용하여 열 사이의 테두리 만 표시하는 방법

  10. 10

    CSS를 사용하여 모바일에서 누적 열의 순서를 변경하는 방법

  11. 11

    JQuery를 사용하여 div의 순서를 변경하는 방법

  12. 12

    perl을 사용하여 html에서 순서대로 인덱스 페이지 번호를 변경하는 방법

  13. 13

    JS forEach를 사용하여 다차원 배열을 HTML 테이블로 변환

  14. 14

    jquery를 사용하여 HTML에서 태그 내부의 텍스트 값 변경

  15. 15

    jQuery 또는 Javascript를 사용하여 객체 배열을 HTML 테이블로 변환

  16. 16

    트리거를 사용하여 매개 변수가있는 다른 테이블에서 열이 업데이트 될 때 한 테이블의 열 업데이트

  17. 17

    html css를 사용하여 모바일 장치에서 테이블 구조를 변경할 수 있습니까?

  18. 18

    JavaScript를 사용하여 세 번째 열에서 HTML 테이블 검색

  19. 19

    jQuery를 사용하여 테이블에서 동적으로 행 범위 변경

  20. 20

    SQLAlchemy를 사용하여 LEFT JOIN 절에서 테이블 순서를 변경하는 방법

  21. 21

    Html 테이블에서 jquery를 사용하여 값 바꾸기

  22. 22

    jQuery를 사용하여 테이블에서 배열 만들기

  23. 23

    Dplyr를 사용하여 그룹의 최대 값을 찾고 동일한 테이블의 다른 열에서 결과를 변경합니다.

  24. 24

    JavaScript 및 jQuery를 사용하여 HTML tbody 테이블의 모든 행에서 첫 번째 열의 값을 덮어 쓰는 방법은 무엇입니까?

  25. 25

    Tampermonkey를 사용하여 HTML에서 클래스 이름 변경

  26. 26

    ReactJS를 사용하여 목록의 항목 순서 변경

  27. 27

    CoreData 및 SwiftUI를 사용하여 To Many 항목의 순서 변경

  28. 28

    xslt를 사용하여 json의 순서 변경

  29. 29

    BeautifulSoup을 사용하여 HTML 테이블에서 하나의 열 스크래핑

뜨겁다태그

보관