2013-02-19 110 views
0

我試圖以動態方式只需點擊一下按鈕添加和刪除文本框的點擊文本框。 add()有效,但remove()沒有。
刪除一個按鈕

$ctra = 1; 
function add() { 
    var ni = document.getElementById('myDiv'); 
    var numi = document.getElementById('theValue'); 
    var num = (document.getElementById('theValue').value -1)+ 2; 
    numi.value = num; 
    var newdiv = document.createElement('div'); 
    var divIdName = 'my'+num+'Div'; 
    newdiv.setAttribute('id',divIdName); 
    newdiv.innerHTML = "<table><tr><td width=159> Name</td>"+ 
      "<td> <input type='text' name='name' size=20> </td>"+ 
      "<td> Address </td>"+ 
      "<td> <input type='text' name='address' size=20> </td>"+ 
      "<td> Tel. No </td>"+ 
      "<td> <input type='text' name='telno' size=20><td> <button type='button' onclick='remove(divIdName);'>Remove</button></table>"; 

    if($ctra<5){ 
     ni.appendChild(newdiv); 
     $ctra++; 
    } 
    $total = $ctra; 
} 

這是remove()。它接受div的名稱。

function remove(dId) { 
    var ni = document.getElementById('myDiv'); 
    ni.removeChild(dId); 
} 


請幫我解決這個問題。謝謝!

+1

我瘦k你需要做這樣的事情'ni.removeChild(document.getElementById(dId));' – Pete 2013-02-19 14:18:07

+0

並且還要通過dId ..中的id。 – gaurav 2013-02-19 14:19:17

+0

你使用jQuery嗎? – Mooseman 2013-02-19 14:26:54

回答

0

你需要改變的onclick是以下幾點:

onclick=\"remove('" + divIdName + "');\" 

,然後調用,像這樣

remove函數
function remove(dId) { 
    var ni = document.getElementById('myDiv'); 
    ni.removeChild(document.getElementById(dId)); 
    return false; 
} 

這裏是工作的它的jsfiddle:http://jsfiddle.net/JFzCf/5/

+0

哦!謝謝!這對我來說並不容易。但是,它只是刪除按鈕,而不是整行。 :o – 2013-02-19 15:05:05

+0

你確定嗎?如果你看看上面鏈接中的jsfiddle,它將刪除整行 – Pete 2013-02-19 15:07:59

+0

是的。它不會刪除整行,只是刪除按鈕。 :嗯 – 2013-02-19 15:16:09

0

你的代碼結構提供了這樣的

<div id='mydiv'> 
    <div id='my'+num+'div'> 
    //You had written table code here 
    </div> 
</div> 

去除document.getElementById('myDiv');的孩子是你的動態創建'my'+num+'div'。請看它

通過這個DIVID到remove..hope您瞭解

+0

我的代碼只有'

'。我已經通過'divIdName'改變了'remove()'的參數(不再有''''+ num +'div'')。 ''我的'+ num +'div''只有在新添加文本框時纔會發生。 :) – 2013-02-19 14:36:04