翻閱古今
2023-09-28 16:59:10
我有一張包含幾行單元格的表格。我的任務(wù)是在單擊后設(shè)置單元格,單元格值將傳遞到 div 塊“已預(yù)訂座位”。我這樣做了,但仍然有一些要求需要滿足。單擊表格單元格(即座位號(hào))后,單元格的背景顏色將永久更改,并且單元格不再可單擊。如何編輯我的代碼以添加這兩個(gè)要求?順便說一下,只允許使用 JavaScript。謝謝你:D<table id="tab"><caption>SCREEN</caption><tr> <td>A1</td> <td>A2</td> <td>A3</td> <td>A4</td> <td>A5</td></tr><tr> <td>B1</td> <td>B2</td> <td>B3</td> <td>B4</td> <td>B5</td></tr><tr> <td>C1</td> <td>C2</td> <td>C3</td> <td>C4</td> <td>C5</td></tr><tr> <td>D1</td> <td>D2</td> <td>D3</td> <td>D4</td> <td>D5</td></tr><tr> <td>E1</td> <td>E2</td> <td>E3</td> <td>E4</td> <td>E5</td></tr></table><script type="text/javascript"> var table = document.getElementById("tab"); if (table != null) { for (var i = 0; i < table.rows.length; i++) { for (var j = 0; j < table.rows[i].cells.length; j++) table.rows[i].cells[j].onclick = function () { getval(this)}; } } function getval(cel) { let seatno = document.createElement("h3"); seatno.innerHTML = cel.innerHTML; document.getElementById("stbk").appendChild(seatno); }</script>
1 回答

守候你守候我
TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超10個(gè)贊
就這么簡(jiǎn)單,只需按照以下方式操作即可。你只需要添加一個(gè)類,clicked并td在 javascript 中設(shè)置一個(gè)條件,如果td有類不做任何工作;
var tdTag = document.querySelectorAll("#tab tr td");
for(var i = 0; i < tdTag.length; i++){
tdTag[i].addEventListener('click', clickedFunction);
}
function clickedFunction(){
if(!this.classList.contains('clicked')){
this.classList.add('clicked');
this.style.background = "red";
}
}
添加回答
舉報(bào)
0/150
提交
取消