如何通過按下按鈕來刪除div？

-1

$(document).ready(function(){ 

    var i=0; 

    var inputs = new Array(); 
    var $type,$name, $label;  

    $("#txt").click(function(){ 
      var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + i); 

    newTextBoxDiv.after().html(
      '<input type="text" name="textbox' + i + 
      '" id="textbox' + inputs.length + '" value="" >' + '<input type="button" id="x'+inputs.length+'"value="x">'); 

    newTextBoxDiv.appendTo("#holder"); 

    inputs.push(['text','textbox'+i,'textboxtx'+i]); 

    i++; 


}); 

$("#chk").click(function(){ 

    var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 

    newTextBoxDiv.after().html(
      '<input type="checkbox" name="checkbox' + i + 
      '" id="checkbox' + inputs.length + '" value="" >' + '<input type="button" id="x'+inputs.length +'"value="x">'); 

    newTextBoxDiv.appendTo("#holder"); 

    inputs.push(['checkbox','checkbox'+i,'checkbotx'+i]); 

    i++; 


}); 

$("#rad").click(function(){ 
    var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 

    newTextBoxDiv.after().html(
      '<input type="radio" name="radio' + i + 
      '" id="radio' + inputs.length + '" value="" >' + '<input type="button" id="x'+inputs.length +'"value="x">'); 

    newTextBoxDiv.appendTo("#holder"); 

    inputs.push(['radio','radio'+i,'radiot'+i]); 

    i++; 


}); 

$("#btn").click(function(){ 
    var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 

    newTextBoxDiv.after().html(
      '<input type="button" name="button' + i + 
      '" id="button' + inputs.length + '" value="button'+i+'" >' + '<input type="button" id="x'+inputs.length +'"value="x">'); 

    newTextBoxDiv.appendTo("#holder"); 

    inputs.push(['button','button'+i,'buttont'+i]); 

    i++; 

    $("#holder").append(inputs); 


});

在下面我被動態addind文本字段按鈕通過按下一個按鈕在該部分我試圖除去某些（創建countains輸入的div）

如何通過按下按鈕來刪除div？

for(a=0 ;a<inputs.length ;a++){ 

    $("#x"+a).click(function(){ 
      $("#Div"+a).remove();  
    }); 
    }; 
})

radion ..等的代碼

但它不工作！ Javascript/jQuery不是我經常使用的語言。所有幫助表示讚賞。謝謝！

<div> 
<div style="display:inline"> 

<input type="button" id="txt" value="Add TextBox" style="" /><br> 
<input type="button" id="chk" value="Add CheckBox" style="" /><br> 
<input type="button" id="rad" value="Add Radio" style="" /><br> 
<input type="button" id="btn" value="Add Button" style="" /><br> 

</div> 
<div id="holder"> 
</div> 




</div> 
</body> 
</html>

來源

2015-05-09 maria El hindy

請出示HTML代碼也 –

我不明白你的問題正確的添加按鈕，文本複選框等代碼正在芬蘭人，但點擊X不是刪除它們是你的問題？ –

是的加入工作正常，但我可以'刪除它們，我不知道在創建元素並將它添加到你的DOM後循環 –

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
</head> 
<body> 
    <div> 
     <div style="display:inline"> 
      <input type="button" id="txt" value="Add TextBox" style="" > 
      <br> 
      <input type="button" id="chk" value="Add CheckBox" style=""> 
      <br> 
      <input type="button" id="rad" value="Add Radio" style="" > 
      <br> 
      <input type="button" id="btn" value="Add Button" style="" > 
      <br> 
     </div> 
     <div id="holder"> 
     </div> 
    </div> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      var i=0; 
      var inputs = new Array(); 
      var $type,$name, $label;  
      $("#txt").click(function(){ 
       var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + i); 
       newTextBoxDiv.after().html(
        '<input type="text" name="textbox'+i+'" id="textbox'+inputs.length+'" value="" ><input type="button" onclick="xtext(\''+i+'\')" id="xtext'+inputs.length+'" value="x">'); 
       newTextBoxDiv.appendTo("#holder"); 
       inputs.push(['text','textbox'+i,'textboxtx'+i]); 
       i++; 
      }); 

      $("#chk").click(function(){ 

       var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 
       newTextBoxDiv.after().html('<input type="checkbox" name="checkbox'+i+'" id="checkbox'+inputs.length+'" value="" ><input type="button" onclick="xcheck(\''+i+'\')" id="xcheck'+inputs.length +'"value="x">'); 
       newTextBoxDiv.appendTo("#holder"); 
       inputs.push(['checkbox','checkbox'+i,'checkbotx'+i]); 
       i++; 
      }); 

      $("#rad").click(function(){ 
       var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 
       newTextBoxDiv.after().html('<input type="radio" name="radio'+i+'" id="radio'+inputs.length+'" value="" ><input type="button" onclick="xradio(\''+i+'\')" id="xradio'+inputs.length +'" value="x">'); 
       newTextBoxDiv.appendTo("#holder"); 
       inputs.push(['radio','radio'+i,'radiot'+i]); 
       i++; 
      }); 

      $("#btn").click(function(){ 
       var newTextBoxDiv = $(document.createElement('div')).attr("id", 'Div' + inputs.length); 

       newTextBoxDiv.after().html('<input type="button" name="button'+i+'" id="button'+inputs.length+'" value="button'+i+'" ><input type="button" onclick="xbtn(\''+i+'\')" id="xbtn'+inputs.length +'" value="x">'); 

       newTextBoxDiv.appendTo("#holder"); 
       inputs.push(['button','button'+i,'buttont'+i]); 
       i++; 
       $("#holder").append(inputs); 


      }); 



     }); 
function xtext(id) 
{ 
    $("#xtext"+id).remove(); 
    $("#textbox"+id).remove(); 

} 
function xcheck(id) 
{ 
    $("#xcheck"+id).remove(); 
    $("#checkbox"+id).remove(); 

} 
function xbtn(id) 
{ 
    $("#xbtn"+id).remove(); 
    $("#button"+id).remove(); 

} 
function xradio(id) 
{ 
    $("#xradio"+id).remove(); 
    $("#radio"+id).remove(); 

} 
</script> 
</body> 
</html>

來源

2015-05-09 15:00:15

謝謝！但我也想刪除創建的div以及 –

哪個div？與文字的div？ –

$（「＃holder」）。remove（）; –

如何通過按下按鈕來刪除div？

回答

相關問題