Question

我有一个问题，我已经解决了什么，但它真烦人。

我有一个js代码，当按下“append”按钮时，它会放下一些html代码，并且使用该代码我给一个x按钮的id，以及一个容器元素的id。我想使用这些id-s通过click函数识别它们，以删除html代码：

$('#x1').click(function(){
    $('#text1').remove();
});

现在讨厌的部分是x上的点击功能。我期望的是，这段代码会以某种方式工作：首先单击“按钮”类元素应该给出以下代码：

$('#x1').click(function(){
    $('#text1').remove();
});

$('#x2').click(function(){
    $('#text2').remove();
});

第二次点击后我应该这样：

$('#x1').click(function(){
    $('#text2').remove();
});

$('#x2').click(function(){
    $('#text2').remove();
});

而不是我在第二次点击后得到的是：

$('#x' + num).click(function(){
    $(this).parent('.container').remove();
});

所以它始终是x按钮想要删除的最后一个元素。我的问题是，为什么我的“num”变量在＃x1处保持“1”，而在＃text1处不能？

我的解决方案是代替父元素：

chown: changing ownership of ?/var/lib/postgresql/data?: Permission denied

我知道，还有“live”功能，我可以使用的功能，而且我不需要乱用id-s，但这看起来更重。那是对的吗？或者我太过于复杂而没有让它变得更有效率？

Answer 1

这是因为num是全局的，您在创建第二个按钮后可以访问它。要解决此问题，您可以使用匿名自执行函数包装代码：

(function(num) {
    $('#x' + num).click(function(){
        $('#text' + num).remove();
    });
})(num);

或者更好地只使用一次点击

$('.parent').on('click', '.container > div', function() {
    $(this).parent().remove();
});