亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

單擊后更改顏色并停止功能(僅限 JavaScript)

單擊后更改顏色并停止功能(僅限 JavaScript)

翻閱古今 2023-09-28 16:59:10
我有一張包含幾行單元格的表格。我的任務是在單擊后設置單元格,單元格值將傳遞到 div 塊“已預訂座位”。我這樣做了,但仍然有一些要求需要滿足。單擊表格單元格(即座位號)后,單元格的背景顏色將永久更改,并且單元格不再可單擊。如何編輯我的代碼以添加這兩個要求?順便說一下,只允許使用 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貢獻1802條經驗 獲得超10個贊

就這么簡單,只需按照以下方式操作即可。你只需要添加一個類,clicked并td在 javascript 中設置一個條件,如果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";

  }

}


查看完整回答
反對 回復 2023-09-28
  • 1 回答
  • 0 關注
  • 85 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號