有两种类似的方法，但那不是很好看，其中一种方法是重构？

Question

有两种类似的方法，但看起来不太好，其中一种方法是重构？

$("#campaign_title_en").on('textchange', function () {
  var slug = escapeSlug($(this).val());
  $("#campaign_slug").val(slug);
});
$("#campaign_slug").on('textchange', function () {
  $("#campaign_title_en").unbind('textchange');
});
$("#campaign_title_zh").on('textchange', function () {
  var slug = escapeSlug($(this).val());
  $("#campaign_slug").val(slug);
});

$("#campaign_slug").on('textchange', function () {
  $("#campaign_title_zh").unbind('textchange');
});

HTML:

 ul.nav.nav-tabs
   li.active
     a href="#en" data-toggle="tab" data-target="#campaign_title_pane_en, #campaign_description_pane_en"  English
   li
     a href="#zh" data-toggle="tab" data-target="#campaign_title_pane_zh, #campaign_description_pane_zh" Chinese

    .tab-pane.active#campaign_title_pane_en
      = f.input :title_en, label: _('Title')
    .tab-pane#campaign_title_pane_zh
      = f.input :title_zh, label: _('Title')
    = f.input :slug, label: 'URI', hint: 'No special characters.'

我在表单中使用了开关，代码有效，但我认为最好进行重构，这样就不会重复了。

Answer 1

$("#campaign_title_en, #campaign_title_zh").on('textchange', function () {
  var slug = escapeSlug($(this).val());
  $("#campaign_slug").val(slug);
});
$("#campaign_slug").on('textchange', function () {
  $("#campaign_title_en, #campaign_title_zh").unbind('textchange');
});