Использовать пользовательскую функцию jQuery для нескольких элементов

Question

Итак, я пытаюсь следовать правилу DRY с помощью этого следующего скрипта. В принципе, мне бы хотелось, чтобы простой способ использовать функцию для нескольких элементов. В настоящее время следующие будут работать только по последнему указанному, а не по трем из них. Я пробовал поместить это в плагин без везения. Еще несколько новых для jQuery, любая помощь очень ценится.

Вот основная рабочая скрипка, что происходит: (.. Я е добавили классы Div вы показываете) http://jsfiddle.net/947E5/

jQuery(function($) { 

    hideShowMetaBoxes = function(page){ 

     var tempID = '#page_template' 
      template = 'templates/' + page + '.php', 
      metabox = '#' + page + '_options'; 

     if ($(tempID).val() == template) { 
      $(metabox).show(); 
      $(metabox+'-hide').prop('checked', true); 
     } else { 
      $(metabox).hide(); 
      $(metabox+'-hide').prop('checked', false); 
     } 

     $(tempID).change(function() { 
      if ($(this).val() == template) { 
       $(metabox).show(); 
       $(metabox+'-hide').prop('checked', true); 
      } else { 
       $(metabox).hide(); 
       $(metabox+'-hide').prop('checked', false); 
      } 
     }); 

    }; 

    // Contact Options 
    hideShowMetaBoxes('contact'); 

    // Meet Us Options 
    hideShowMetaBoxes('meet_us'); 

    // Services Options 
    hideShowMetaBoxes('services'); 

}); 

Answer 1

Я изменил некоторый РОМ. Вот сценарий:

jQuery(function($) { 

hideShowMetaBoxes = function(page){ 
    $('.templateoption').hide();//added for hidingd all template option divs 

    var tempID = '#page_template' 
     template = 'templates/' + page + '.php', 
     metabox = '#' + page + '_options'; 

    if ($(tempID).val() == template) { 
     $(metabox).show(); 
     $(metabox+'-hide').prop('checked', true); 
    } else { 
     $(metabox).hide(); 
     $(metabox+'-hide').prop('checked', false); 
    } 
    }; 
}); 
$('#page_template').change(function(){ 
hideShowMetaBoxes($("#page_template option:selected").text().toLowerCase().replace(/ /g,"_")); 
}); 

Working Demo