HTML 동적 div 자바 스크립트 호출에 대한 크기 조정

그래서 나는 테이블에 필요에 따라 행을 추가하려면 자바 스크립트 함수를 사용하고 있습니다. div를 크기를 조정하여 행을 추가 할 때 div가 크기가 커져서 새 행을 조정할 수 있도록 노력하고 있습니다. 페이지 크기가 균일 해 지도록 크기를 조정하려면 div 옆에 div가 필요합니다. 동적 테이블의 기능으로 사용자는 테이블에서 행을 추가 및 삭제할 수 있습니다. 어떤 도움을 주셔서 감사합니다.HTML 동적 div 자바 스크립트 호출에 대한 크기 조정

감사합니다. 사업부를 테이블에 행을 추가하고 연장

 <div class="leftboxes leftline1"> 
     Full Name Of Detained Juvenile 
     </br> 
     <input id="detaineeLastName" onfocus="if (this.value=='Last') this.value = ''" 
     type="text" value="Last"/> 
     <input id="detaineeFirstName" onfocus="if (this.value=='First') this.value = ''" 
     type="text" value="First"/> 
     <input id="detaineeMiddleName" onfocus="if (this.value=='Middle') this.value = ''" 
     type="text" value="Middle"/> 
     </br> 
     Aliases 
     <table id="witnessTable" style="table-layout:fixed" border="1">   
      <tr>   
       <td style="width:0px"><input type="checkbox" name="chk" style="width:15px;margin- 
       left:18px"/></td>   
       <td><input id="aliasLast" onfocus="if (this.value=='Last') this.value = ''" 
       type="text" value="Last"/></td> 
       <td><input id="aliasFirst" onfocus="if (this.value=='First') this.value = ''" 
       type="text" value="First"/></td> 
       <td><input id="aliasMiddle" onfocus="if (this.value=='Middle') this.value = ''" 
       type="text" value="Middle"/></td>  
      </tr>  
     </table> 
     <input type="button" value="Add Row" onclick="addRow('witnessTable')" />  
     <input type="button" value="Delete Row" onclick="deleteRow('witnessTable')" /> 
     </br> 
    </div> 
    <div class="rightboxes rightline1"> 
     Sex 
     </br> 
     Age 
     </br> 
     DOB 
    </div>

출처

2012-03-12 Michael Cole

에는 고정 된 높이가 있습니까? – MatuDuke

div의 높이가 고정됩니다. 나는 그들이 필요한 곳에 div를 정렬하고 종이 양식과 같은 레이아웃을 만들기 위해 고정 된 높이를 사용하고있었습니다. –

을,이 퍼팅 시도 : 그것은 그들을 처리 할 수 easyer 그래서

var h = myTable.clientHeight; 
var divRight = document.getElementById("right"); 
var divLeft = document.getElementById("left"); 

divRight.style.height = (h + 60) + "px"; 
divLeft.style.height = (h + 60) + "px";

참고 나는 div의에 ID 라벨을 추가했다.

출처

2012-03-12 18:04:17 MatuDuke

사용이 -

가

var y = document.createElment("the tag of the element wanted to be created"); 
var x = document.getElementByClassname("tables class"); 
x.appendChild(y);

후 삭제 x.removeChild();를 사용한다.

그런 다음 이벤트를 트리거 할 요소의 이벤트 처리기를 변경 한 다음 코드를 삽입하면 두 div 모두에서 변경됩니다.

편집 : getElementByClassName을 사용하여 첨부 된 요소가 테이블의 스타일 클래스에 들어가서 안정된 모양으로 크기가 증가하도록 스타일링 프로세스를 간소화했습니다.

출처

2012-03-12 17:52:02 engma

사용 JQuery와 그 옵션의 경우 : 같은

var divOneHeight = $("#div1ID").height() + 10; 
$("#div1ID").height(divOneHeight); 

var divOneWidth = $("#div1ID").width() + 10; 
$("#div1ID").width(divOneWidth);

뭔가. 다른 자바 스크립트 사용 : 당신이 행을 추가하거나 제거 할 때

document.getElementById("div1ID").style.width += 10;

출처

2012-03-12 18:01:53 jacqijvv

HTML 동적 div 자바 스크립트 호출에 대한 크기 조정

답변

관련 문제