테이블에 동적으로 양식 필드를 추가해도 행의 높이가 조정되지 않습니다

이 페이지에는 주어진 명단에있는 학생에 대한 정보를 입력하는 양식이 있습니다. 각 학생은 드롭 다운 상자와 설명 필드가있는 표에 나열됩니다. 각 학생에 대해 "다른 추가"버튼이있어서 학생이 학생에 관한 두 번째 메모를 입력 할 수 있습니다. 버튼을 클릭테이블에 동적으로 양식 필드를 추가해도 행의 높이가 조정되지 않습니다

이 자바 스크립트 함수를 실행합니다 :

var counter=1; 
function multipleDemerits(studentID) { 
counter++; 
var anotherDemeritRow = "<select name='behavior_"+studentID+"_"+counter+"'><option value=0>Select --></option><option value=0></option><option value=0>1 demerit behaviors</option><option value=1>&nbsp;&nbsp;unprepared</option><option value=2>&nbsp;&nbsp;incomplete hw</option><option value=3>&nbsp;&nbsp;electronics/phone</option><option value=4>&nbsp;&nbsp;uniform</option><option value=5>&nbsp;&nbsp;talking/making noise</option><option value=0></option><option value=0>2 demerit behaviors</option><option value=6>&nbsp;&nbsp;tardy</option><option value=7>&nbsp;&nbsp;wasting time</option><option value=8>&nbsp;&nbsp;food/gum</option></select>&nbsp;&nbsp;Comments: <input name='comments_"+studentID+"_"+counter+"' type='text' size='30' maxlength='100'/><br />&nbsp;"; 
document.getElementById(studentID).innerHTML += anotherDemeritRow; 
}

새로운 드롭 다운 및 Mac 브라우저에서 완벽하게 코멘트 필드 표시,하지만 그래서 윈도우 파이어 폭스 나 IE한다. 현재 테이블 행의 높이가 증가하지 않으므로 추가 필드가 테이블의 나머지 행과 겹치기 시작합니다. 내가 뭘 원하는지.

거기에있는 Windows 브라우저 전문가의 아이디어가 있습니까? 감사!

업데이트 : jQuery의 추가로 변경 ... 차이가 없습니다. 그러나 함수의 처음 부분에 경고문을 추가하면 작동합니다. 어?!?!

출처

2009-08-31 Jen

데모 링크가 권한이 부여되지 않은 액세스 오류를 발생시키는 것 같습니다. – Corey

고마워요, – Jen

파이어 폭스와 IE의 일부 테이블 렌더링 문제를 해결하기 때문에 'innerHTML'대신 'append()'을 사용해야한다고 생각합니다.

출처

2009-08-31 02:56:03 Aziz

감사합니다. innerHTML이 항상 테이블과 잘 어울리지는 않습니다. 일반적인 의미에서 그것을 피하는 것이 가장 좋습니다. 독립 실행 형 컨테이너 (예 : div)를 만들고 innerHTML을 사용하여 구조를 만든 다음 div를 테이블/행에 추가 할 수 있습니다. – Glenn

테이블 행을 블록으로 표시 할 수 있습니까? 그것은 높이를 고칠 수 있습니다.

windows firefox는 페이지의 모든 문제를보고합니까?

출처

2009-08-31 04:34:20 Christian

테이블에 동적으로 양식 필드를 추가해도 행의 높이가 조정되지 않습니다

답변

관련 문제