Javascript：點擊時刪除特定表格單元格

我正在研究一個大學項目。他們告訴我們製作2個陣列。第一個將有3個單元格，3個圖像，第二個單元格將爲1個空單元格。Javascript：點擊時刪除特定表格單元格

我需要從第一個表格中每次單擊的單元格中移除圖像並將其複製到第二個表格！

我的問題是deleteCell()函數每次只會刪除第一個元素。我不知道如何從我的表格行中刪除CLICKED單元格！

我的JS：

var table1 = document.getElementById("myTable"); 
var table2 = document.getElementById("myTable2"); 

function DL1() { 

    var row = document.getElementById("myRow1"); 
    row.deleteCell(); 
} 

function CR2() { 
    var row = document.getElementById("myRow2"); 

}

我的HTML：

<table id="myTable" class="auto-style1"> 
    <tr id="myRow1"> 
    <td onclick="DL1()"><img src="../../2.jpg" /></td> 
    <td onclick="DL1()"><img src="../../1.gif" /></td> 
    <td onclick="DL1()"><img src="../../3.png" /></td> 
    </tr> 
</table> 

<table id="my2Table"> 
    <tr id="myRow2"></tr> 

</table>

來源

2016-05-24 Dimitris HD

一個類似的問題，可以在這裏找到： [在此輸入鏈接描述]（http://stackoverflow.com/questions/5571730/javascript-how-to-iterate-through-a-table-and-remove-the-second-cell-in-javascr） – sosaisapunk

var table1=document.getElementById("myTable"); 
var table2=document.getElementById("myTable2"); 

function DL1(elem){ 

var row = document.getElementById("myRow1"); 
for(i=0;i<row.children.length;i++) { 
if(row.children[i]==elem) { 
row.deleteCell(i); 
row2=document.getElementById("myRow2"); 
row2.appendChild(elem); 
} 
} 
} 

<td onclick="DL1(this)"><img src="http://placehold.it/100x100"/></td> 
<td onclick="DL1(this)"><img src="http://placehold.it/150x100"/></td> 
<td onclick="DL1(this)"><img src="http://placehold.it/200x100"/></td>

演示：https://jsfiddle.net/Lt2cyw0g/2/

所以，你需要獲得點擊的元素的索引（它傳遞給函數，並檢查指標，並用它在deleteCell（）函數），然後添加元素到第二個錶行...

來源

2016-05-24 21:06:42 sinisake

點擊的元素只是傳遞給函數：

var table1 = document.getElementById("myTable"); 
 
var table2 = document.getElementById("myTable2"); 
 

 
function DL1(td) { 
 
    td.parentNode.removeChild(td); 
 
} 
 

 
function CR2() { 
 
    var row = document.getElementById("myRow2"); 
 

 
}

<table id="myTable" class="auto-style1"> 
 
    <tr id="myRow1"> 
 
    <td onclick="DL1(this)"> 
 
     <img src="../../2.jpg" /> 
 
    </td> 
 
    <td onclick="DL1(this)"> 
 
     <img src="../../1.gif" /> 
 
    </td> 
 
    <td onclick="DL1(this)"> 
 
     <img src="../../3.png" /> 
 
    </td> 
 
    </tr> 
 
</table> 
 

 
<table id="my2Table"> 
 
    <tr id="myRow2"></tr> 
 

 
</table>

來源

2016-05-24 20:59:37 ahwayakchih

-2

希望它能幫助，不需要ID：

var a = document.querySelectorAll("table tr"); 
 
for(var b in a){ 
 
    var c = a[b]; 
 
    if(typeof c == "object"){ 
 
    c.onclick = function(){ 
 
     this.offsetParent.deleteRow(this.rowIndex); 
 
    } 
 
    } 
 
}

<table > 
 
<tr><td>1</td><td>2</td><td>3</td></tr> 
 
    <tr><td>1a</td><td>2a</td><td>3a</td></tr> 
 
    <tr><td>1b</td><td>2b</td><td>b</td></tr> 
 
</table> 
 

 
<table> 
 
<tr><td>a</td><td>aa</td><td>aa</td></tr> 
 
<tr><td>b</td><td>bb</td><td>bb</td></tr> 
 
<tr><td>c</td><td>cc</td><td>cc</td></tr> 
 
</table>

來源

2016-05-24 21:09:19

Javascript：點擊時刪除特定表格單元格

回答

相關問題