2010-11-24 67 views
4
 $(function(){ 
      var namecounter = 0 
      $("#getitem").click(function(){ 
       namecounter++ 
       var txtval = $("#txt").val(); 
       $('<tr><td><input type="button" name="txt'+ namecounter +'" value="remove" /><input type="text" id="txt'+ namecounter +'a" name="txt'+ namecounter +'a" value="'+txtval+'"/></td><td></td><td></td></tr>').appendTo('#pasok'); 
      }); 
      $(":button[name^='txt']").click(function(){ 
       var currentValue = $(this); 
       var target = $("#" + currentValue.attr("id") + "a"); 
       $(target).remove(); 
      }); 
     }); 

如何通過JQUERY刪除創建的元素?如何通過JQUERY刪除創建的元素?

回答

2

您的按鈕不具有id屬性,它有一個name屬性(兩者也有直接訪問DOM屬性),那麼你可以這樣做:

$(function(){ 
    var namecounter = 0 
    $("#getitem").click(function(){ 
     namecounter++ 
     var txtval = $("#txt").val(); 
     $('<tr><td><input type="button" name="txt'+ namecounter +'" value="remove" /><input type="text" id="txt'+ namecounter +'a" name="txt'+ namecounter +'a" value="'+txtval+'"/></td><td></td><td></td></tr>').appendTo('#pasok'); 
    }); 
    $("#pasok").delegate(":button[name^='txt']", "click", function(){ 
     $("#" + this.name + "a").remove(); 
    }); 
}); 

You can test it out here

還請注意使用.delegate(),因此它適用於您要添加的按鈕,而不僅僅是在您的document.ready函數運行時出現的那些按鈕。

+0

雖然你可能需要「a」之前的空格。 ````````````一個``` – 2010-11-24 09:41:36

1

你的目標變量已經是一個jquery對象。所以,你應該改變$(target).remove();target.remove();

+0

這是一個很好的優化,但遺憾的是,這不能成爲他的代碼破壞的原因。東西像`$($($($($('body')))))`仍然有效;這對性能來說真的很糟糕。 – 2010-11-24 09:43:32