javascript - 单击之前附加为单击处理程序的函数

因此，我有一个简单的应用程序，可以使用本地数据结构动态绘制折线图中的变量。折线图下方的图例中显示变量名称及其对应的颜色。一切都很标准。

我正在尝试添加功能，用户可以通过单击图例中该变量的名称来从折线图中删除单个变量。我试图通过使用jQuery附加点击处理程序来做到这一点，如下所示：

$('.legendItem').click(removeVariable);

但是，为了从基础数据结构中删除变量，removeVariable()需要变量名称。我将此存储在data跨度的.legendItem属性中。这样，我可以使用$('.legendItem').data('keyword')访问该属性。由于可以有许多不同的.legendItem元素，因此我希望将data-keyword属性动态地传递给每个单击的元素的removeVariable（）函数。

但是，当我尝试将数据传递添加到点击处理程序时遇到了麻烦。当我将“关键字”作为参数添加到removeVariable()并包括：

$('.legendItem').click(removeVariable($(this).data('keyword')));

当我在Chrome JS调试器中调试时，第二个示例调用removeVariable（）函数，但第一个示例不调用。由于单击处理程序依赖于脚本此阶段不存在的数据，因此会导致错误。是否有我忽略的明显错误或进行这种动态操作的更好方法？

最佳答案

您正在执行removeVariable函数，而不是传递对其的引用。您可以通过使用匿名函数来避免这种情况：

$('.legendItem').click(function() {
    removeVariable($(this).data('keyword'));
});