動態文本框沒有刪除

Question

我正在通過jquery添加文本框和一個文本框它正在刪除perfeclty，但是當我添加兩個文本框，然後它現在刪除兩個。

這是jQuery的

<script> 

$(document).ready(function($){ 
    $('.product-form .add-product').click(function(){ 
     var n = $('.text-product').length + 1; 

     var product_html = $('<p class="text-product"><label for="product' + n + '">Name <span class="product-number">' + n + '</span></label> <input required type="text" name="productnames[]" value="" id="product' + n + '" /> <label for="productprice' + n + '">Price <span class="product-number">' + n + '</span></label> <input required type="text" name="productprices[]" value="" id="productprice' + n + '" /><a href="#" class="remove-product">Remove</a></p>'); 
     product_html.hide(); 
     $('.product-form p.text-product:last').after(product_html); 
     product_html.fadeIn('slow'); 
     return false; 
    }); 
    $('.product-form').on('click', '.remove-category', function(){ 
     $(this).parent().fadeOut("slow", function() { 
      $(this).remove(); 
      $('.product-number').each(function(index){ 
       $(this).text(index + 1); 
      }); 
     }); 
     return false; 
    }); 
}); 
</script> 

，這是我的HTML

<div> 
     <form> 

      <div class="product-form"> 
       <p class="text-product"> 
        <label for="product1">Name <span class="product-number">1</span></label> 
        <input required type="text" name="productnames[]" value="" id="product1" /> 
        <label for="product1">Price <span class="product-number">1</span></label> 
        <input required type="text" name="productprices[]" value="" id="product1" /> 
        <div> 
         <a class="add-product" href="#">Add More</a> 
        </div> 
       </p> 
      </div> 
      <div> 
       <input type="submit" name="submitDetails" value="Finish"/> 
      </div> 

     </form> 
    </div> 

如果只有一個實例productnames文本框添加然後去除功能的作品，但是當我添加誤事productnames和productprices文本框去除功能不會同時刪除

Answer 1

您的代碼應爲$('.product-form').on('click', '.remove-product', function()而不是'click', '.remove-category'。此外，不要將Add More div元素放置在段落元素中。編號也打破了一些，但你可以弄清楚。