자바 스크립트를 사용하여 테이블 내에서 단락의 내용을 변경하는 데 문제가 있습니다

저는 HTML과 자바에 상당히 익숙하지만 (저는 웹 디자인 클래스 atm을 사용하고 있습니다) 좋은 프로그래머입니다. (C#, C++, visual 기본, 자바, 그리고 다른 몇 가지) 그리고 나는 물건을 디버깅하는 데 상당히 능숙합니다. 지금 좋은 물건 위에 =).자바 스크립트를 사용하여 테이블 내에서 단락의 내용을 변경하는 데 문제가 있습니다

테이블 내부에있는 단락 태그의 텍스트 내용을 변경하려고합니다. 다음은 재미있는 부분입니다. 드롭 다운에서 셀을 선택한 다음 텍스트를 텍스트 필드에 입력 한 다음 마지막으로 단추를 눌러 설정하면됩니다. 드롭 다운의 선택 항목 값은 셀 내의 단락 ID와 정확히 동일합니다. 버튼을 누르면 드롭 다운에서 선택한 항목의 값과 텍스트 필드의 텍스트 값을 저장 (이론적으로는 시도 할 수 없었 음) 한 다음 단락 안의 html을 .innerHtml로 설정하여 텍스트를 텍스트 상자 그것은 내가 선택한 옵션을 .getElementId() 호출의 id와 텍스트 var에 무엇을 저장할지를 저장 한 var를 사용합니다. 설명 할 것이 있는지는 모르겠다. 그래서 여기에 자바 스크립트가 포함 된 전체 htm 파일이있다.

<HTML> 
<HEAD> 
    <TITLE>Table Pg 1</TITLE> 
</HEAD> 
<BODY background="http://www.pptbackgrounds.net/uploads/elegant-grey-illumination-background-presentations-powerpoint-backgrounds.jpg" link="#FF00FF" alink="#9900FF" vlink="#0000FF" text="#00FF00"> 
    <SCRIPT> 
     var tableOneBorder = 1; 

     function incBorder() 
     { 
      tableOneBorder = tableOneBorder + 1; 

      document.getElementById("tab1").setAttribute("border", tableOneBorder); 
     } 

     function decBorder() 
     { 
      if(tableOneBorder > 0) 
      { 
       tableOneBorder = tableOneBorder - 1; 
      } 

      document.getElementById("tab1").setAttribute("border", tableOneBorder); 
     } 

     function changeContent() 
     { 
      var cell = document.getElementById("dropDown")[document.getElementById("dropDown").selectedIndex].value; 
      var text = document.getElementById("textField").value; 

      document.getElementById(cell).innerHtml = text; 
     } 

    </SCRIPT> 
    <BUTTON onclick="decBorder()">Decrease Border</BUTTON> <BUTTON onclick="incBorder()">Increase Border</BUTTON> 
    <BR> 
    <BR> 
    Enter text, select cell, and click 'Change' to change a cell: 
    <INPUT type="text" id="textField"/> 
    <select id="dropDown"> 
     <option value="a1">A1</option> 
     <option value="a2">A2</option> 
     <option value="a3">A3</option> 
     <option value="a3">A4</option> 

     <option value="b1">B1</option> 
     <option value="b2">B2</option> 
     <option value="b3">B3</option> 
     <option value="a3">B4</option> 

     <option value="c1">C1</option> 
     <option value="c2">C2</option> 
     <option value="c3">C3</option> 
     <option value="a3">C4</option> 
    </select> 
     <BUTTON onclick="changeContent()">Change Text</BUTTON> 
    <BR> 
    <BR> 
    <BR> 
    <TABLE id="tab1" border="1" width="80%" align="center" wrap="hard"> 
    <TR height="100"> <TD><P align="center" id="a1">TEST</P></TD> <TD><P align="center" id="a2">TEST</P></TD> <TD><P align="center" id="a3">TEST</P></TD> <TD><P align="center" id="a4">TEST</P></TD></TR> 
    <TR height="100"> <TD><P align="center" id="b1">TEST</P></TD> <TD><P align="center" id="b2">TEST</P></TD> <TD><P align="center" id="b3">TEST</P></TD> <TD><P align="center" id="b4">TEST</P></TD></TR> 
    <TR height="100"> <TD><P align="center" id="c1">TEST</P></TD> <TD><P align="center" id="c2">TEST</P></TD> <TD><P align="center" id="c3">TEST</P></TD> <TD><P align="center" id="c4">TEST</P></TD></TR> 
    </TABLE> 

</BODY>

출처

2015-01-16 KillerOfPie

모든 것이 바보 같은 실수 fine..Just입니다 .. :) 아래에 다음과 같이 'innerHTML을'과 'innerHTML을'을 대체 마십시오

document.getElementById를 (셀) .innerHTML = 텍스트;

은 ..이 링크에서 또한 필요없이 HTML 콘텐츠의 경우 '는 TextContent'를 사용할 수 있습니다 innerHTML

출처

2015-01-16 03:16:34

OMG, 덕분에 그것에 대해 자세히 알아보세요. 정말 우스운 일이 뭔지 알아? 나는 그것을 고치기위한 나의 연구 때문에 그것을 사용했다. 분명히 나는 3 개의 대문자를 건너 뛰었습니다. -_- – KillerOfPie

@ KillerOfPie 실험실 선생님이 당신에게 말할 수 없었습니다 .. : D –

하하 .. 나에게도 많이 .. .. :). 대답 ...;) –

자바 스크립트를 사용하여 테이블 내에서 단락의 내용을 변경하는 데 문제가 있습니다

답변

관련 문제