Javascript刪除特定行

我試圖讓腳本刪除一個錶行。Javascript刪除特定行

var i = 1; 

function addURL() { 
    var tr = document.createElement('tr'); 
    tr.setAttribute("id", "url_row_" + ++i); 
    var td = tr.appendChild(document.createElement('td')); 
    td.style.valign = 'middle'; 

    td = tr.appendChild(document.createElement('td')); 
    var input = td.appendChild(document.createElement('input')); 
    input.name = 'url[]'; 
    input.type = 'text'; 
    input.size = '40' 
    var node = document.getElementById('myTable').tBodies[0]; 
    node.insertBefore(tr, node.children[3]); 

    var link = document.createElement("a"); 
    link.setAttribute("href", ""); 
    link.setAttribute("style", "text-decoration: none;"); 
    link.setAttribute("onClick", "removeURL('');return false;"); 
    td = tr.appendChild(document.createElement('td')); 
    td=td.appendChild(link) 
    td.appendChild(document.createTextNode('-')); 
} 

function removeURL(divNum) { 
    var d = document.getElementById('myTable').tBodies[0]; 
    var olddiv = document.getElementById(divNum); 
    d.removeChild(olddiv); 
}

這可以產生儘可能多的url_row_（number）文本字段，我想要的。我只是不知道如何刪除這些行。

我知道這樣

link.setAttribute("onClick", "removeURL('url_row_2');return false;");

將刪除url_row_2，但我能在放這url_row_2將抓住一切ID，該行或什麼是正確的代碼來做到這一點？

來源

2012-12-19 markerpower

「*搶什麼ID，該行*」 - 用你想用的ID，如果沒有識別它什麼？ – Bergi

我想通過id來識別它，但我不能放入url_row_2，因爲那樣只會刪除該行。我需要它來獲取鏈接「 - 」所在的每一行的id。如果我創建了url_row_2，url_row_3和url_row_4，那麼它們旁邊會出現一個「 - 」。當我點擊「 - 」時，它應該刪除我點擊的「 - 」所在的行。如果我點擊url_row_3旁邊的「 - 」，它會刪除url_row_3。 – markerpower

要做到這一點，你可以使用字符串連接來連接i到處理程序字符串中，以定位給定的tr。

link.setAttribute("onclick", "removeURL('url_row_" + i + "');return false;");

來源

2012-12-19 19:50:15

感謝您的幫助。 – markerpower

請勿使用setAttribute作爲事件偵聽器。看看Introduction to event handling at quirksmode.org，特別是在simple event registration model。此外，你可以使用從事件對象的信息，以確定該行刪除：

function clickHandler(event) { 
    var anchor = this; // == event.targetElement 
    var tr = anchor.parentNode.parentNode; 
    tr.parentNode.removeChild(tr); 
    event.preventDefault(); // do not follow the href 
} 

function addURL() { 
    … 

    var link = document.createElement("a"); 
    link.setAttribute("href", "#"); 
    link.setAttribute("style", "text-decoration: none;"); 
    link.onclick = clickHandler; 
    td = tr.appendChild(document.createElement('td')); 
    td.appendChild(link) 
    link.appendChild(document.createTextNode('-')); 
}

來源

2012-12-19 22:43:03 Bergi

Javascript刪除特定行

回答

相關問題