0

jQuery 中的委派/“on”似乎是新的热点。我完全明白委托函数接收事件对象。

但我的问题是如何将语义/应用程序数据传递给委托？

老方法，没有委托：

// bind a new closure for each button
for (var i = 0; i < MyApp.Widgets.length; i++) {
  var widgetId = MyApp.Widgets[i];

  $('#myapp-widget-button-' + i).click(
    function () {
      MyApp.upgradeWidgetById(widgetId);
    }
  );
}

新方式，委托（和部分缺失）：

// refactor custom closures into one delegate
$('#myapp-widget-container').delegate('.myapp-widget-button', 'click', function () {
  // MyApp.upgradeWidgetById( ... )
});

从哪里来widgetId？我感觉到这是数据属性发挥作用的地方：

新方式，具有委托和数据属性

// attach application data to the handled objects
for (var i = 0; i < MyApp.Widgets.length; i++) {
  var widgetId = MyApp.Widgets[i];

  $('#myapp-widget-button-' + i).data('widgetId', widgetId);
}

// refactor custom closures into one delegate
$('#myapp-widget-container').delegate('.myapp-widget-button', 'click', function () {
  var widgetId = $(this).data('widgetId');

  MyApp.upgradeWidgetById(widgetId)
});

但这真的是唯一的方法吗？我很担心，因为没有多少教程提到与代表相关的数据属性，所以我想知道我是否遗漏了什么或做错了什么。

编辑：编辑以反映“开”是新的黑色，尽管是穿着羊皮的代表。

4

1 回答 1

1

您实际上并不需要委托，因为您似乎为这些元素设置了 data 属性。

只需.click像下面这样使用数据参数，

// attach application data to the handled objects
for (var i = 0; i < MyApp.Widgets.length; i++) {
  var widgetId = MyApp.Widgets[i];

  $('#myapp-widget-button-' + i).click({'widgetId', widgetId}, myFunction);
}

//later in code
function myFunction(e) {
    var widgetId = e.data.widgetId;

    //your code
}

注意：我正在使用.click，因为我不确定您使用的 jQuery 版本。

于 2013-02-27T16:28:55.947 回答