javascript - Jquery - 删除 append 代码不起作用

Question

我在删除 append 代码时遇到问题。
尝试添加一些 div 并检查结果。
当你在新的 div 上尝试 dblclicked 时，他不会被删除。

HTML:

<input id="val" name="value" />
<input id="submit" type="button" value="ok" />
<div id="content"></div>

脚本:

$("div[id^='block_']").on('dblclick', function() {
 $(this).remove();
});

$("#submit").click(function(){
 if ( $('#val').val().length > 0 )
 {
  $('#content').append('<div id="block_'+ $('#val').val() +'">'+ $('#val').val() +'</div>');

  $('#val').val('');
 }
});

这是 JSFiddle
我使用 jquery 2.0.3。

Answer 1

当您绑定(bind)点击事件时，您的元素不存在。使用删除事件:

$('#content').on('dblclick', "div[id^='block_']", function() {
    $(this).remove();
});

这里有您需要的所有信息:http://api.jquery.com/on/#direct-and-delegated-events