셀에 대해 colspan/rowspan 설정

테이블이 있는데 런타임에 셀의 속성을 colspan/rowspan으로 변경하고 싶습니다. 여기 예가 있습니다 :셀에 대해 colspan/rowspan 설정

<html> 
    <head> 
     <script type="text/javascript"> 
      function setColSpan() { 
       document.getElementById('myTable').rows[0].cells[0].colSpan = 2 
      } 
     </script> 
    </head> 

    <body> 
     <table id="myTable" border="1"> 
      <tr> 
       <td>cell 1</td> 
       <td>cell 2</td> 
      </tr> 
      <tr> 
       <td>cell 3</td> 
       <td>cell 4</td> 
      </tr> 
     </table> 
     <form> 
      <input type="button" onclick="setColSpan()" value="Change colspan"> 
     </form> 
    </body> 

</html>

제 문제는 셀이 이동한다는 것입니다. 문제의 세포가 걸려있는 세포를 제거해야합니까?

제거하지 않고도 할 수 있습니까?

간단한 스프레드 시트를 구현하고 싶습니다. 지금은 사각형 셀 범위를 선택하고 "선택한 셀 병합"옵션이있는 메뉴를 표시 할 수있었습니다. 세포를 "병합"할 수 있기를 바라고 다른 세포를 제거하지 않고 세포를 확장하는 것이 좋을 것입니다.

출처

2013-02-01 warvariuc

셀을 병합하려면 해당 값은 어떻습니까? 두 셀의 값을 연결 하시겠습니까? – DON

@DON, 이상적으로는 어떻게 든 값을 유지하고 싶습니다 ("덮어 쓴"셀을 숨길 수도 있습니다). 그렇지 않은 경우 삭제하십시오. – warvariuc

셀을 삭제해야한다고 생각합니다. 다음 코드로 확인하십시오. 내가 한 일은 전체 행을 삭제하고 새로운 열 범위가있는 새로운 행을 추가했습니다.

function setColSpan() { 
    var table = document.getElementById('myTable'); 
    table.deleteRow(0); 
    var row = table.insertRow(0); 
    var cell = row.insertCell(0); 
    cell.innerHTML= "cell 1" 
    cell.colSpan = 2 
}

출처

2013-02-01 04:25:57 999k

셀이 이동했기 때문에 셀이 변경되었습니다. 다음과 같은 표를 정의하고 있습니다.

<tr> 
    <td colspan="2">cell 1</td> 
    <td>cell 2</td> 
</tr> 
<tr> 
    <td>cell 3</td> 
    <td>cell 4</td> 
</tr>

그래서 내가 기대하는 바가 있습니다.

셀을 병합하려면 병합 된 모든 셀의 내용을 가져 와서 단일 셀로 연결하고 나머지는 제거해야합니다. 간단한 예를 들면 다음과 같이 나타납니다.

function setColSpan() { 
    var myTable = document.getElementById('myTable'); 
    var cell2html = myTable.rows[0].cells[1].innerHTML; 
    myTable.rows[0].deleteCell(1); 
    myTable.rows[0].cells[0].innerHTML = myTable.rows[0].cells[0].innerHTML + ' ' + cell2html; 
    myTable.rows[0].cells[0].colSpan = 2; 
}

그러나 좀 더 강력한 솔루션은 복잡합니다. 특히 병합 해제 기능이 필요한 경우 당신은 어떻게 든 오래된 셀 구조의 정보를 보존해야 할 것입니다 ... <span class="oldCell">cell 2</span>과 같은 것을 병합 된 데이터 주위에 두는 것이 가능합니까? 그런 다음 병합 해제 할 때 "oldCell"의 존재 여부를 확인 하시겠습니까? 그러나 사용자 편집을 통해 해당 정보를 보존해야합니다. 행과 열에 병합하는 것이 무엇을 의미하는지 파악하십시오. 그리고 그것이 겹쳐지는 병합을 의미하는지 알아 내십시오.

출처

2014-04-14 14:49:09 spinn

셀에 대해 colspan/rowspan 설정

답변

관련 문제