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

Question

首先，我不想使用jQuery或其他庫 - 純JS。

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

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

Answer 1

您可以使用onmouseover爲此，

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

Answer 2

我建議：

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; 
    */ 
}