jquery刪除（）與多個表格

我想刪除表單中的一個部分。我有相同部分的多個表單。當我在Split3的MyForm1中並觸發移除時，MyForm1中只有Split3應該被移除而不是全部。jquery刪除（）與多個表格

例如使用任何建議：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> test</title> 
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.js'></script> 
    <style type='text/css'> 
    form { 
    font-family: helvetica, arial, sans-serif; 
    font-size: 11px; 
} 

form div{ 
    margin-bottom:10px; 
} 

form a { 
    font-size: 12px; 
    padding: 4px 10px; 
    border: 1px solid #444444; 
    background: #555555; 
    color:#f7f7f7; 
    text-decoration:none; 
    vertical-align: middle; 
} 
    </style> 
<script type='text/javascript'>//<![CDATA[ 
$(document).ready(function() { 
    $('form[name="inpForm"]').submit(function() { 
     var $form = $(this).closest("form"); 
     alert($(this).find('input[name="FirstName"]').val()); 
     alert("name of form: " + $form.attr('name')) 
     alert("div index: " + $(this).closest("div").attr('id')); 
     return false; 
    }); 

    $('.removeSplit_2_').click(function(){ 
     var numItems = $('div').length; 
     alert("Aantal div secties: "+ numItems); 
     $('div').each(function(){ 
      var indexDiv = $(this).attr('id'); 
      alert("div index: " + indexDiv); // or simple this.id 
      if (numItems == indexDiv) { 
       alert('Do your thing and remove the div section'); 
       //$(this).remove(); 
      } 
     }); 
    }); 

    $('.removeSplit_3_').click(function(){ 
     var MijnID  = this.id; 
     alert(MijnID); 
     var numItems = $('div').length; 
     alert("Aantal div secties: "+ numItems); 
     $('div').each(function(){ 
      var indexDiv = $(this).attr('id'); 
      alert("div index: " + indexDiv); // or simple this.id 
      if (numItems == indexDiv) { 
       alert('Do your thing and remove the div section'); 
       //$(this).remove(); 
      } 
     }); 
    }); 
});//]]> 

</script> 

</head> 
<body> 
<form name = "MyForm1"> 
    <div id="Split1">MyForm1 Split1 
     <input name="FirstName" type="text"/> 
    </div> 
    <div id="Split2">MyForm1 Split2 
     <div name="cButton_2_" id="cButton_2_" class="cButton_2_" ><input name="FirstName" type="text"/></div> 
     <div name="xButton_2_" id="xButton_2_" class="xButton_2_" ><a href="javascript:void(0);" id="removeSplit_2_" class="removeSplit_2_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div> 
    <div id="Split3">MyForm1 Split3 
     <div name="cButton_3_" id="cButton_3_" class="cButton_3_"><input name="FirstName" type="text"/></div> 
     <div name="xButton_3_" id="xButton_3_" class="xButton_3_"><a href="javascript:void(0);" id="removeSplit_3_" class="removeSplit_3_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div> 
</form> 
<form name = "MyForm2"> 
    <div id="Split1">MyForm2 Split1 
     <input name="FirstName" type="text"/> 
    </div> 
    <div id="Split2">MyForm2 Split2 
     <div name="cButton_2_" id="cButton_2_" class="cButton_2_"><input name="FirstName" type="text"/></div> 
     <div name="xButton_2_" id="xButton_2_" class="xButton_2_"><a href="javascript:void(0);" id="removeSplit_2_" class="removeSplit_2_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div> 
    <div id="Split3">MyForm2 Split3 
     <div name="cButton_3_" id="cButton_3_" class="cButton_3_"><input name="FirstName" type="text"/></div> 
     <div name="xButton_3_" id="xButton_3_" class="xButton_3_"><a href="javascript:void(0);" id="removeSplit_3_" class="removeSplit_3_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div> 
</form> 
<form name = "MyForm3"> 
    <div id="Split1">MyForm3 Split1 
     <input name="FirstName" type="text"/> 
    </div> 
    <div id="Split2">MyForm3 Split2 
     <div name="cButton_2_" id="cButton_2_" class="cButton_2_"><input name="FirstName" type="text"/></div> 
     <div name="xButton_2_" id="xButton_2_" class="xButton_2_"><a href="javascript:void(0);" id="removeSplit_2_" class="removeSplit_2_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div> 
    <div id="Split3">MyForm3 Split3 
     <div name="cButton_3_" id="cButton_3_" class="cButton_3_"><input name="FirstName" type="text"/></div> 
     <div name="xButton_3_" id="xButton_3_" class="xButton_3_"><a href="javascript:void(0);" id="removeSplit_3_" class="removeSplit_3_"><IMG SRC="./1x.gif" BORDER="0"></a></div> 
    </div>  
</form> 
</body> 
</html>

來源

2014-11-20 Cyrille Heltzel

當我使用： '$（」 removeSplit_2_。 '）.click（function（）{var mySplit = $（'.Split_2_'）; mySplit.remove（）;}）;' 所有slpits2將被刪除。當我使用： '$點擊（函數（）{ VAR mySplit; 變種形式= $（本）.closest（「形式」）ATTR（ '身份證 '）;（' removeSplit_2 _'）。 var formObj = document.getElementByIdform）; // mySplit = $（'.Split_2_'）;不工作 mySplit = $（form）.find（'Split_2_'）; //mySplit.remove（）;也無法正常工作 $（「div」）.remove（mySplit）;}）;'這個resulte在沒有被刪除 – 2014-11-20 18:01:29

因此，所有你需要做的是這樣的：

$("#Split3").remove();

會搶第一個ID名爲「Split3」，並刪除它！

我希望這就是你要找的。

JSBin：http://jsbin.com/kibipoxowa

盧卡

來源

2014-11-20 18:08:35 LucaSpeedStack

它將刪除所有split3而不是ony的形式。 – 2014-11-20 18:26:51

@CyrilleHeltzel No ...如果你看看JSBin，它證明它只能刪除第一個.... – LucaSpeedStack 2014-11-20 20:34:47

根據您的意見，試試這個：

$('.removeSplit_2_').click(function() { 
    var mySplit = $(this).closest('.Split_2_'); 
    mySplit.remove(); 
});

來源

2014-11-20 18:16:44

$(document).on("click", "a", function() { 
    $(this).remove(); 
});

測試這個

來源

2014-11-20 18:17:55 ashkufaraz

jquery刪除（）與多個表格

回答

相關問題