Javascript 在jQuery'；s.on（）数据对象？

我正在使用.on（）在DOM中添加侦听器一些项—一个输入范围字段，以及一些带有.colorBlock类的块。这些事件侦听器只需要间歇性地处于活动状态，我想在它们不使用时将其关闭。这样做意味着使用命名函数而不是匿名函数

这很公平，只是我需要将数据传递到回调函数中。我知道我可以使用第二个（第三个？）参数字段将对象传递给事件，这在回调中是可读的，但这样做似乎将其范围限定到事件，而不是侦听.on（）的DOM节点。例如，见下文：

$('#brushSize').on('touchend', { size: $(this).val() }, utils.setBrushSize);
$('.colorBlock').on('touchstart', { color: $(this).data('color') }, utils.setColor);

在我的回调函数中，我为e.data.color和e.data.size添加了一个警报，并且都调用了未定义的

更糟糕的是，这是一个手机gap应用程序，所以我只能追踪传递的信息，所以我的一些假设可能是错误的

有什么建议吗

---

谢谢。

让我们把这一行分解一下：

$('#brushSize').on('touchend', { size: $(this).val() }, utils.setBrushSize);

$('.colorBlock').on('touchstart', { color: $(this).data('color') }, utils.setColor);

它与此完全相同（变量除外）：

例如，您正在调用

$（this）.val（）

，然后将调用结果作为数据对象的一部分传入。因此，除非

这个

已经是您想要从中获取该点的值，否则它将不起作用

如果希望在事件发生时从元素中获取一些信息，只需将该代码放入事件处理程序中即可。例如，看这一行：

$('#brushSize').on('touchend', { size: $(this).val() }, utils.setBrushSize);

$('.colorBlock').on('touchstart', { color: $(this).data('color') }, utils.setColor);

在我看来，您正在尝试从触摸的

.colorBlock

元素中获取颜色。如果是：

$('.colorBlock').on('touchstart', function() {
    utils.setColor($(this).data('color'));
});

或者，如果要重复使用它：

utils.setColorFromEventElement = function() {
    utils.setColor($(this).data('color'));
};

及

---

旁注：

这条线可能还有第二个问题。您正在使用

utils.setBrushSize

作为事件处理程序。请注意，在对

setBrushSize

的调用中，

此

将引用挂接事件的DOM元素，而不是

utils

。现在，考虑到名称

utils

，也许这并不重要，但我想我应该提到它

---

更多信息：，

在arguments对象中发送的值始终是调用.on（）语句时的数字。不会在每次事件触发时动态地重新调用该函数

就我个人而言，我认为让util类寻找某个DOM元素并获取其值是非常难看的，正如您所提到的，您真正想要做的是让util函数在与.on（）语句相同的范围内运行

你的第一直觉可能是正确的。您不需要匿名函数，因为您希望能够调用（）。理想情况下，您需要一个与调用on（）语句的对象在同一范围内运行的命名函数。因此，您要做的是将util函数绑定到当前作用域：

$('#brushSize').on('touchend', utils.setBrushSize.bind(this));

然后在utils.setBrushSize中，$（this）是您从中调用的任何函数

不过，编辑一个警告：当您调用（）时，您希望这样调用它：

$('#brushSize').off('touchend', utils.setBrushSize);

不在新的范围绑定版本的setBrushSize上。JQuery应该将其识别为等同于您绑定的原始函数，并将其关闭

重新编辑我现在意识到您的val（）是$（'#brushSize'），因为这是您试图调用的“this”。。。不是包含on语句的函数。在这种情况下，您可以这样做：

$('#brushSize').on('touchend', utils.setBrushSize.bind($(this)));

---

因此，这个特殊问题的解决方案最终要求我将这段代码从Phone Gap中剥离出来，并在浏览器中重新构建。然后，我能够将发送到回调的事件记录到console.log中，并对它们进行检查，以便更好地理解事件对象

解决方案是使用event.target。这允许从brushSize范围侦听器获取.colorBlock侦听器的event.target.dataset.color和event.target.value

因此，对于未来的我来说，我最好在浏览器中有一个可靠的应用程序版本，去掉手机的空白部分，以便更好地测试类似的问题。

您是否尝试过

$（'.colorBlock'）.attr（'color'）