요구 사항
rowspan 및 colspan이 포함된 테이블을 복원합니다.
예를 들어 원본 테이블은 다음과 같습니다.
복원된 테이블은 다음과 같습니다.
코드 원리
td의 rowspan 속성 값이 1보다 큰 경우 현재 td의 상위 요소의 형제 요소에 td를 추가합니다. of td가 1보다 큰 경우 현재 td 요소 뒤에 td
// 이 기사의 첫 번째 블로그: http://artwl.cnblogs.com(2012/02/08)jQuery.fn.RevertTable=function(){
$("tr" ,this).each(function(trindex,tritem){
$(tritem).find("td").each(function(tdindex,tditem){
var rowspanCount=$(tditem).attr( "rowspan");
var colspanCount= $(tditem).attr("colspan")
var value=$(tditem).text()
var newtd="
" value " | ";
if(rowspanCount>1){
var parent=$(tditem).parent("tr")[0]
while(rowspanCount--> 1){
$(parent).next().prepend(newtd);
parent=$(parent).next()
}
$(tditem).attr("rowspan ",1);
}
if(colspanCount>1){
while(colspanCount-->1){
$(tditem).after(newtd);
}
$(tditem).attr("colspan ",1);
}
})
}
온라인 데모
http://demo.jb51.net/js /2012/jquery_demo/jquery_rowspan_colspan_table.html
요약 이 문서에서는 rowspan 및 colspan이 포함된 테이블을 복원하는 솔루션 중 하나만 제공합니다. 테스트하고 토론하십시오.
테이블 셀 병합에 대한 코드는 이미 온라인에서 사용할 수 있습니다.
원문 제목: 셀 나누기를 사용하는 jQuery colspan 및 rowspan 테이블
원문 주소: http://willifirulais.blogspot.com/2007/07/ jquery-테이블-열-break.html