jquery - 如何在 jQuery 中将两个事件处理程序合并为一个？

Question

是否有一种简单的方法将这两个 jQuery 函数合并为一个，从而消除不必要的重复？

$('form#search input').on('keyup', function() {
    if ($(this).val() == '') {
    $('a#clear').hide();
  }
  else {
    $('a#clear').show();
  } 
});

$('form#search select').on('change', function() {
    if ($(this).val() == '') {
    $('a#clear').hide();
  }
  else {
    $('a#clear').show();
  }
});

感谢您的帮助。

Answer 1

如果你想以最优雅、最短的方式有条件地绑定(bind)它们，你可以这样做:

var $formSearch = $('form#search'),
    hideShow = function () {
        if ($(this).val() == '') {
          $('a#clear').hide();
        }
        else {
          $('a#clear').show();
        }
    };

$formSearch.find('input').on('keyup', hideShow); 
$formSearch.find('select').on('change', hideShow); 

如果您希望两个选择器都触发两个事件，您可以这样做。这样做可能没问题，因为您可能希望无论如何都触发这些。

$('form#search input, form#search select').on('keyup change', function() {
    if ($(this).val() == '') {
    $('a#clear').hide();
  }
  else {
    $('a#clear').show();
  }
});