효과 스크린샷: html 코드: 코드 복사 코드는 다음과 같습니다. 서가 번호 선택 >< ;script type="text/javascript" src="01.js"> <br>#table1 td { <br> 텍스트-정렬:중심; <br>너비:15%; <br>} <br>#table2 td { <br>텍스트-정렬:센터 <br>배경색:# dcdcdc; <br>커서:포인터 <br>} <br><body> <br><table id="table1" border="0" cellpadding="1" 셀 간격 =" 1" 스타일="너비: 100%"> <br><td>선반</td> <br><td>1층<br>2층</td> <br><td>3층</td> <br><td>4층</td> <br><td>5층<br></tr> <br></table> <br><table id="table2" border="0" cellpadding="1"cellspacing="1" style="width:100 %;"> ; <BR><tr> <br><td style="배경-색상:#ffffff;">A001</td> <br><td id="td0" title=" A001-1| 11" style="Background-color:#6699FF;"></td> <br><td id="td1" title="A001-2|12" ></td> ; <BR> <td id="td2" title="A001-3|13" ></td> <br><td id="td3" title="A001-4|14"> ; <br><td id="td4" title="A001-5|15"></td> <br></tr> <br><tr> ="배경색:#ffffff;">A002</td> <br><td id="td5" title="A002-1|21"></td> id="td6" title="A002-2|22"></td> <br><td id="td7" title="A002-3|23"></ td> ><td id="td8" title="A002-4|24"></td> <br><td id="td9" title="A002-5|25"></ td> <br></tr> <br><td style="Background-color:#ffffff;">A003</td> td10" title="A003-1|31"></td> <br><td id="td11" title="A003-2|32"></td> <br>< td id="td12" title="A003-3|33"></td> <br><td id="td13" title="A003-4|34">< 🎜><td id="td14" title="A003-5|35"></td> <br></tr> <br><tr> background-color:#ffffff;">A004</td> <br><td id="td15" title="A004-1|41"></td> <br>< ;td id= "td16" title="A004-2|42"></td> <br><td id="td17" title="A004-3|43"></td> ;td id="td18" title="A004-4|44"></td> <br><td id="td19" title="A004-5|45">< ;/td> <br></tr> <br><tr> <br><td style="Background-color:#ffffff;">A005</td> <br><td id ="td20" title="A005-1|51"></td> <br><td id="td21" title="A005-2|52"></td> <br> <td id ="td22" title="A005-3|53"></td> <br><td id="td23" title="A005-4|54"></td> ; <td id="td24" title="A005-5|55"></td> <br></tr> <br></table> ></html> <br><br> <br>자바스크립트 코드: <br><br><br><br><br>코드 복사<br><br><br> 코드는 다음과 같습니다. <br><div class="codebody" id="code92858"> <br>var tdnum = 0; <br>var trid = "td"; <br>// 키보드 이벤트 <br>document.onkeydown = function(event){ <br>// Mozilla Firefox와 호환 가능 <br>if (null == 이벤트) { <br>event = window.event <br>} <br>if (event.keyCode == 13) { <br>p13key() <br> else if (event.keyCode <= 40 && event.keyCode >= 37) { <br>keytd(event.keyCode) <br>} <br>} <br>// Enter 키를 누르세요 <br> function p13key(){ <br>var tdid = trid tdnum; <br>var tdtitle = document.getElementById(tdid).getAttribute("title") <br>var pos = tdtitle.indexOf("|"); 🎜>var 좌석 이름 = tdtitle.substring(0, pos); <br>var 좌석 ID = tdtitle.substring(pos 1, tdtitle.length) <br>window.alert(seatname "," 좌석 ID); <br>//색상 변경<br>function setcolor(oldtd, newtd){ <br>document.getElementById(oldtd).style.BackgroundColor="#dcdcdc" <br>document.getElementById(newtd).style.BackgroundColor == -tdnum; <br>if (null == document.getElementById(trid tdnum)) { <br>tdnum ; <br>return; <br>} <br>setcolor(trid (tdnum 1), trid tdnum) ; <br>} <br>//맞습니다<br>else if (key == 39) { <br> tdnum; <br>if (null == document.getElementById(trid tdnum)) { <br>tdnum- -; <br>return; <br>} <br>setcolor(trid (tdnum - 1), trid tdnum) <br>} <br>// on <br>else if (key == 38) 🎜> tdnum = tdnum - 5; <br>if (null == document.getElementById(trid tdnum)) { <br>tdnum = tdnum 5; <br>return; <br>} <br>setcolor(tdnum 5) , trid tdnum) <br>} <br>// 다음<br>else if (key == 40) { <br>tdnum = tdnum 5 <br>if (null == document.getElementById(trid) tdnum) ) { <br>tdnum = tdnum - 5; <br>return; <br>} <br>setcolor(trid (tdnum - 5), trid tdnum) <br>} <br>} <br><br> </div> </td> </div>
