jQuery - 全局变量的问题

jQuery - issue with global variable

本文关键字：问题 全局变量 jQuery      更新时间：2023-09-26

>我遇到了一个问题，可能是缺乏使用全局变量的经验，这导致了一些问题。

请检查此 http://jsfiddle.net/ZgXKx/当您单击单击我时！我正在使用全局变量动态设置某些元素的 id。

我的代码有问题：

$("#service-sets").on('click', "#facebook-del-"+a, function() {           
    var aa = $("#facebook-del-"+a).parent().parent().parent().attr("id");
    $('#'+aa).remove();

它没有进入 Click 事件，因为 .on('click') 中的"#facebook-del-"+a不起作用，而 Click 事件中的那个正在工作（显示值 "#facebook-del-1" ）。

当我像这样更改代码时，它没有问题

$("#service-sets").on('click', "#facebook-del-1", function() {           
    var aa = $("#facebook-del-"+a).parent().parent().parent().attr("id");
    $('#'+aa).remove();

你可以在这里查看 http://jsfiddle.net/ZgXKx/1/

那么我犯了什么错误呢？

谢谢！

$("#service-sets").on('click', "[id^=facebook-del]", function() {          
    $(this).closest('div.tag').remove();
});

演示

这里

[id^=facebook-del]是那些元素（十字架），谁id以facebook-el开头。所以像这样设置委托事件不需要任何全局变量a索引。

$(this).closest('div.tag')目标div.tag，这是点击十字的容器。

问题源于这样一个事实，即与它的外观相反，"a"变量不是全局的。它位于 jsfiddle 本身为您创建的函数中。

将左侧的控件设置为将代码放置在<head>中，而不是放置在"onload"处理程序中，它将起作用。

此外，没有理由执行您正在使用该代码执行的操作来删除添加的标记。也就是说，查找元素，获取其"id"值，然后通过"id"重新找到它的过程是没有意义的。 一旦你找到了带有".parent（）"调用的元素（这本身就是一种非常脆弱的做事方式;最好给外部包装器一个类，然后使用.closest(".whatever")），你就得到了它，没有理由再次找到它。

编辑——现在我想起来了，虽然我说的"a"是真的——它不是真正的全局——在这种情况下应该无关紧要。 然而，这是对jsfiddle的刺激的常见原因（当然，祝福他们的心）。

直到在回调中单击#facebook-button 之前，您不会递增a。当它运行时：

$("#service-sets").on('click', "#facebook-del-"+a, function() {           
    ..
});

a仍然是 0，并且您只处理永远不会存在的#facebook-del-0的点击事件。

您可以改用类进行删除。给你的关闭按钮类"facebook-del"，然后使用它来关闭它：

$("#service-sets").on('click', '.facebook-del', function() {           
    $(this).parent().parent().parent().remove();
});

JSFiddle

相关文章：