使用jQuery将单击绑定到动态按钮？

我想创建一个动态点击jQuery的按钮。在用户完成并点击按钮后，我想销毁该按钮并单击jQuery，直到我需要重新创建它为止

---

我不知道如何在jQuery中实现这一点。我知道jQuery.live是一个选项，但我不确定这比我想要的方式更好还是更糟。

这应该行得通。适当更改字符串中的html：

   $('#targetdiv').append( $("<div>foobar</div>").click( function(evt) { $(this).remove(); }))

$（'#targetdiv'）。追加（$（“foobar”）。单击（函数（evt）{$（this.remove（）；}））

---

这里有一个演示它的应用程序。

Live可以很好地工作。如果希望避免使用live，可以在将新按钮添加到DOM时将其连接起来

function addNewButton() {
  $("sweet_selector_here").append("<input type='button' id='sweetness' value='press me, i am awesome' />");
  $("#sweetness").click(function() {
    $(this).remove();
  });
}

函数addNewButton（）{
$（“此处为甜选择器”）。追加（“”）；
$（“#甜度”）。单击（函数（）{
$（this.remove（）；
});
}

使用live，它将变成：

function addNewButton() {
  $("sweet_selector_here").append("<input type='button' id='sweetness' value='press me, i am awesome' />");
}

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

函数addNewButton（）{
$（“此处为甜选择器”）。追加（“”）；
}
$（“#甜蜜”）.live（“点击”，函数（）{
$（this.remove（）；
});

很抱歉，我发布了一个如此古老且已回答的问题。我有一个类似的问题，这个答案帮助了我，但并没有让我完全达到目的。经过反复试验。。。下面是我为网页添加区域并删除它们的实用解决方案。我将其用于动态表单字段，但您的需求可能会有所不同

这是页面静态部分中的部分表单

<fieldset>
  <legend>Email-tauluun</legend>
    <a class="button_ajax email-add">Add new area</a>
    <p>
      <span class="email_original_area">
        <label>Email:
          <input type="text" name="emails[]" id="email0" />
        </label>
      </span>

      <!--Below we add some more areas-->
      <span id="email_add_area"></span>
    </p>
</fieldset>

电子邮件陶伦
添加新区域

电邮：

然后我们需要一些JavaScript函数。这些使用jQuery

<script type="text/javascript">

//we need a counter for dynamic fields
var cnt=0;

$(document).ready(function(){
  $('.email-add').click(function(){

  cnt += 1; //let's count...

  $('#email_add_area').append(
    '<span class="dynExtra"><br /><label>Email: ' +
    '<input type="text" name="emails[]" id="email' + cnt + '" /></label>' +
    '</span>'
  );

    //this function creates a button for newly created area
    //must be done after the creation of the area
    addRemover();
  });
});

function addRemover() {
  //appends remove button to the last created area
  $('<a class="button_ajax dynExtra-clear" name="dynExtra-clear">Remove area ' + cnt + '</a>').appendTo('#email_add_area');

  //remove the clicked button and it's previous sibling
  $('.dynExtra-clear').click(function(){
  $(this).prev().remove();
  $(this).remove();
  });
}

</script>

//我们需要一个动态场计数器
var-cnt=0；
$（文档）.ready（函数（）{
$（'.email add'）。单击（函数（）{
cnt+=1；//让我们数一数。。。
$（“#电子邮件_添加_区域”）。追加(
“
电子邮件：”+
'' +
''
);
//此函数为新创建的区域创建一个按钮
//必须在创建区域后执行
addRemover（）；
});
});
函数addRemover（）{
//将“删除”按钮附加到上次创建的区域
$（'Remove area'+cnt+''）。附加到（'email_add_area'）；
//删除单击的按钮及其上一个同级
$（'.dynExtra clear'）。单击（函数（）{
$（this.prev（）.remove（）；
$（this.remove（）；
});
}

---

希望这对某些人有帮助，我没有忘记任何事情。

如果你开始大量使用live，它会出现性能问题吗？我尝试了类似于链接的方法，但没有成功。我试着把一个警告框放在点击上，它永远不会做任何事情。当我尝试演示并点击按钮时，什么都没有发生。奇怪。在FF和IE中对我有效。控制台中没有错误吗？