在Druapl中使用javascript

本篇參考自這篇Managing JavaScript in Drupal 7

在drupal中有幾種方式可以在頁面含入自訂的Javascript函式(庫)，分述如下：

1. 利用drupal_add_js() 指定要含入的js檔，或是以字串型式直接含入javascript的程式碼，適用於module、theme、自訂PHP。範例如下：
   

   drupal_add_js('misc/collapse.js'); //含入js檔案
   drupal_add_js('misc/collapse.js', 'file'); //含入js檔案
   drupal_add_js('jQuery(document).ready(function () { alert("Hello!"); });', 'inline'); //嵌入程式碼
   drupal_add_js('jQuery(document).ready(function () { alert("Hello!"); });',
       array('type' => 'inline', 'scope' => 'footer', 'weight' => 5)
     ); //在 footer 嵌入程式碼
   drupal_add_js('http://example.com/example.js', 'external'); //含入外部js檔案
   
   //建立自訂模組的設定值
   drupal_add_js(array('myModule' => array('key' => 'value')), 'setting'); //設置模組myModule的 Drupal.settings 設定值
   //取出設定值
   $setings['key']=Drupal.settings.myModule.key;
   
   

2. 在module的 .info檔中含入js檔，加入以下內容即可
   scripts[] = somescript.js
    
3. 要使用jQuery的話，用以下的語法
   

   (function ($) {  
   // 把你的jQuery程式放在這裡
   })(jQuery);

4. 使用Drupal.behaviors整合不同模組的javascript，可讓ajax產生的內容可以執行原本預計的程式，語法如下：
   

   (function ($) {
   //exampleModule 為自訂的名稱，通常可使用自訂模組的名稱
     Drupal.behaviors.exampleModule = {
       attach: function (context, settings) {
       //要執行的程式，本範例會綁定 $('.example')的click事件
         $('.example', context).click(function () {
           $(this).next('ul').toggle('show');
         });
       }
     };
   })(jQuery);