javascript - 结合类似的点击处理程序以减少 jquery 中使用的代码？

Question

我有 2 个点击事件，它们经历了一系列不同的操作，这 2 个事件之间唯一不同的是 2 行。有没有一种方法可以组合这些点击以减少使用的代码量？

$('a.register').click(function() {
                $('h4#registerHead').addClass('active');
                $('#registerMessage').show();
                $('#nav li span a').css({'color':'#8F8F8F'});
                $('#alertNav').css({'color':'#dedede'}).addClass('activeSub');
            });

            $('a.subscribe').click(function() {
                $('h4#subscribeHead').addClass('active');
                $('#subscribeMessage').show();
                $('#nav li span a').css({'color':'#8F8F8F'});
                $('#alertNav').css({'color':'#dedede'}).addClass('activeSub');
            });

欢迎就此提出所有建议，谢谢。

Answer 1

第一种方式:

var doIt = function(event){
  $("h4#"+event.data.type+"Head").addClass('active');
  $("#"+event.data.type+"Message").show();
  $('#nav li span a').css({'color':'#8F8F8F'});
  $('#alertNav').css({'color':'#dedede'}).addClass('activeSub');
};

$('a.register').bind('click', {type: 'register'}, doIt);
$('a.subscribe').bind('click', {type: 'subscribe', doIt});

第二种方式:

var commonHandler = function(){
  $('#nav li span a').css({'color':'#8F8F8F'});
  $('#alertNav').css({'color':'#dedede'}).addClass('activeSub');
};

$('a.register').click(function() {
  $('h4#registerHead').addClass('active');
  $('#registerMessage').show();
  commonHandler();
});

$('a.subscribe').click(function() {
  $('h4#subscribeHead').addClass('active');
  $('#subscribeMessage').show();
  commonHandler();
});