JQuery - 将click事件添加到多个元素

时间:2015-06-04 14:44:32

标签: jquery event-handling

我有以下内容:

$('#applicationsGrid tbody').on('click', 'td.details-control', function () {
    var formattedData = dosomething();
    $(this).parent('tr').after(formattedData);
});

$('#applicationsGrid tbody').on('click', 'td.child-details-control', function () {
    var formattedData = dosomething();
    $(this).parent('tr').after(formattedData);
});

$('#applicationsGrid tbody').on('click', 'td.grand-child-details-control', function () {
    var formattedData = dosomething();
    $(this).parent('tr').after(formattedData);
});

如何将所有“on”事件组合成一个单击事件,该事件将负责点击“td.details-control”,“td.child-details-control”,“td.grand-child-details” -control',所以我可以减少重复的代码?

2 个答案:

答案 0 :(得分:2)

在jquery中使用多重选择器(“selector1,selector2,selectorN”)

$('#applicationsGrid tbody').on('click', 'td.details-control,td.child-details-control,td.grand-child-details-control', function () {
      var formattedData = dosomething();
      $(this).parent('tr').after(formattedData);
});

Learn Multiple selector

答案 1 :(得分:1)

您可以使用multislector连接

$('#applicationsGrid tbody').on('click', 'td.details-control,td.child-details-control,td.grand-child-details-control', function () {
              var formattedData = dosomething();
              $(this).parent('tr').after(formattedData);
            });

或使用 end with selector ,在您的情况下,所有类值都以 details-control 结束,

  $('#applicationsGrid tbody').on('click', ,'td[class$=details-control]', function () {
              var formattedData = dosomething();
              $(this).parent('tr').after(formattedData);
            });