識別表格的mouseon並插入值

首先，我不想使用jQuery或其他庫 - 純JS。識別表格的mouseon並插入值

我的目標是建立拖&掉落的物品（我已經做了一部分），當你在表格單元格（<td>）拖動一個項目，它（<td>）會改變他的background color，當我把項目到<td>它應該將當前顏色更改爲其他顏色。

我認爲我需要檢測什麼時候產品在<td>上，我該怎麼做，以及如何知道我應該更改哪個<td>。

來源

2013-06-18 Luis

嘗試使用onmouseover事件。 – Gimmy

我的問題是如何檢測用戶是否在一個表格單元格和它是哪個表格單元格（因爲有很多表格單元格）。 – Luis

我希望你不要介意我的問題：爲什麼你不需要使用JQuery或其他庫？ – penguat

您可以使用onmouseover爲此，

document.getElementById(id).onmouseover = function() {//do something};

來源

2013-06-18 10:31:59

我應該給每個單元格添加一個'id'並且爲每個單元格打開該功能嗎？它看起來並不是最佳做法。 – Luis

我建議：

var table = document.getElementsByTagName('table')[0]; 

function colorCell(e){ 
    var cell = e.target; 
    cell.style.backgroundColor = '#f00'; 
} 

table.addEventListener('mouseover', colorCell, false);

或者，你可以直接綁定到td元素本身：

var cells = document.getElementsByTagName('td'); 
for (var i = 0, len = cells.length; i < len; i++) { 
    cells[i].addEventListener('mouseover', colorCell, false); 
    /* or: 
    cells[i].onmouseover = colorCell; 
    */ 
}

來源

2013-06-18 10:52:35

該表位於元素下（我將其拖入表格中），因此它不會識別'mouseover'，因爲'mouseover'是指我正在拖動的元素。 – Luis

識別表格的mouseon​​並插入值

回答

相關問題

識別表格的mouseon並插入值