2013-12-09 76 views
-1

所以我試圖按照下面這個腳本的DRY規則。基本上我想要一個簡單的方法在多個元素上使用一個函數。目前,以下僅適用於指定的最後一個,而不是全部三個。我試圖把這個插入一個沒有運氣的插件。 jQuery仍然有點新鮮,任何幫助都非常感謝。在多個元素上使用自定義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'); 

}); 
+0

將是巨大的,如果你可以創建小提琴.. –

+0

我希望我能。當使用具有特殊選項的頁面模板時,它適用於Wordpress。這將根據所選的頁面模板顯示/隱藏指定的選項。 – souporserious

+0

我相信你可以。你只需要在小提琴中添加dom和腳本。 –

回答

1

我已經修改了一些DOM。 下面是腳本:

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

+0

感謝您的幫助。請參閱我的更改。 – souporserious

+0

很高興爲你工作.... :) –

相關問題