2013-02-19 115 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