动态添加和删除jquery按钮

JavaScript和jQuery的新手，但我试图动态添加按钮，然后删除它们，当他们被点击。如果一个按钮已经存在了（在同一个类中，我创建了新的按钮），它可以被删除。如果用户添加了新按钮，则该按钮无法控制。我也尝试了在类似帖子中提到的.live方法无济于事。任何帮助表示赞赏。谢谢。动态添加和删除jquery按钮

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title> test </title> 
    <script src="jquery-1.6.2.js"></script> 
    <script> 
    /* 
     $(document).ready(function(){  
     $(".btn :button").click(function(){ 
      $(this).remove(); 
     }); 
    */ 
    $(".btn :button").live("click", function(){ 
     $(this).remove(); 
    }); 

    function add() { 
     // $(".btn").append("<button> new one </button>"); 
     $("<button> new one </button>").insertAfter(".btn"); 
    }; 
    </script> 
</head> 
<body> 
    <div class="btn"> 
    <button> test </button> 
    </div> 
    <br /><br /> 
    <div class="adding"> 
    <button onclick='add()'> add </button> 
    </div> 
</body> 
</html>

来源

2011-11-15 jtwg

$("button").live("click", function(){ 
    $(this).remove(); 
});

，或者，如果你想删除父容器，以及：

$("button").live("click", function(){ 
    $(this).parent().remove(); 
});

UPDATE：

如果你只想要一个特定的div里面的按钮，试试这个：

$(".adding button").click(function() { 
    $('.adding').before('<div class="btn"><button>new one</button></div>'); 
}); 

$(".btn button").live("click", function() { 
    $(this).parent().remove(); 
});

来源

2011-11-15 09:04:21

感谢您的回复，我会重新发布，但这也会删除我的添加按钮。它存在于不同的div中。否则，它似乎工作，所以我很有希望。感谢您的帮助 – jtwg

已更新。检查出来：http://jsfiddle.net/samliew/X2dR8/ –

谢谢。这很棒。 – jtwg

你不需要一个:前button选择

$(".btn button").live("click", function(){ 
    $(this).remove(); 
    });

来源

2011-11-15 09:03:16

感谢您的答复和投票。出于某种原因，这对我不起作用。我尝试了与没有冒号的第一次发布相同的代码，它仍然没有效果。不确定是否有任何浏览器问题，但它不适用于Chrome浏览器或Safari浏览器。我尝试了jquery的托管版本（来自jquery下载页面），以防我的问题出现，但仍然没有任何结果。如果我能找出问题 – jtwg

动态添加和删除jquery按钮

回答

相关问题