จะเพิ่มจาวาสคริปต์แบบมีเงื่อนไขลงในธีมได้อย่างไร


10

ฉันต้องการใช้สคริปต์Selectivizrเพื่อจำลองตัวเลือก CSS3 ใน IE6-8

แต่ฉันมีเวลายากที่จะเพิ่มลงในธีมของฉัน จนถึงตอนนี้พยายาม:

1) บังคับให้ใส่ส่วนหัว html.tpl.php:

<!--[if lt IE 9]>
<script src="<?php print base_path() . path_to_theme(); ?>/js/selectivizr.js"></script>
<![endif]-->

แต่ base_path () ดูเหมือนจะไม่ส่งคืนสิ่งใดใน D7 (อย่างน้อยก็ใน html.tpl.php - อาจอยู่ใน page.tpl.php ... ) และฉันรู้ว่านี่ไม่ใช่วิธี Drupal ที่จะทำมันต่อไป

2) การเพิ่มลงในไฟล์. info ของธีมของฉัน:

scripts[] = selectivizr.js

แต่มันไม่มีเงื่อนไขแน่นอน :(

3) ใช้drupal_add_js ()ใน template.php ของฉัน

แต่อีกครั้งฉันไม่แน่ใจว่าสามารถตั้งเงื่อนไขได้หรือไม่

คำตอบ:


3

ฉันคิดว่า 1) ตัวเลือกที่ดีที่สุดคือ

คุณไม่จำเป็นต้องเรียกใช้ฟังก์ชันใด ๆ คุณมีค่าเหล่านั้นอยู่แล้ว:

<script type="text/javascript" src="<?php print $base_path . $directory; ?>/js/selectivizr.js"></script>

FYI <?php dsm($variables) ?>ในไฟล์เทมเพลตใด ๆ เพื่อดูว่ามีตัวแปรใดบ้าง (พร้อมติดตั้งโมดูล devel)

มีโมดูลสไตล์ชีทที่มีเงื่อนไขซึ่งมีโซลูชันที่หรูหราสำหรับการเพิ่มเงื่อนไข IE ในไฟล์. info แต่ยังคงใช้สำหรับ CSS เท่านั้น (ดูคำขอคุณลักษณะสำหรับ JS)


15

นี่คือวิธีที่ฉันเพิ่ม html5shiv ในไฟล์ template.php ของฉัน:

$html5shiv = array(
  '#tag' => 'script',
  '#attributes' => array( // Set up an array of attributes inside the tag
    'src' => drupal_get_path('theme', 'mythemename') . '/js/lib/html5shiv.js', 
  ),
  '#prefix' => '<!--[if lte IE 8]>',
  '#suffix' => '</script><![endif]-->',
);
drupal_add_html_head($html5shiv, 'html5shiv');

4
การเปลี่ยนแปลงสองอย่าง: เพิ่ม '#value' และตั้งค่าเป็น '' จากนั้นเปลี่ยน '#suffix' เป็นเพียง '<! [endif] ->' เพื่อรับมาร์กอัปตามมาตรฐาน
Angry Dan

แก้ไขในข้อเสนอแนะของ @ AngryDan
wizonesolutions

1

ฉันคิดว่านี่เป็นอบ แต่ผิด

ดูเหมือนว่าธีมของการเป็นแม่จะใช้บรรณารักษ์นี้

มันทำสิ่งต่าง ๆ เล็กน้อยจากคุณ แต่ตัวเลือกของคุณเป็นหลัก 1

  $vars['selectivizr'] = '<!--[if (gte IE 6)&(lte IE 8)]>';
  $vars['selectivizr'] .= '<script type="text/javascript" src="/sites/all/libraries/selectivizr/selectivizr.js"></script>';
  $vars['selectivizr'] .= '<![endif]-->';

ดูเหมือนว่ารหัสนี้จะไม่ทำงานหากเว็บไซต์ของคุณไม่อยู่ภายใต้ /

แต่ถ้าจำเป็นสำหรับไลบรารี่ของคุณฉันไม่เห็นปัญหาในการใส่โค้ดเงื่อนไขลงในไฟล์ page.tpl.php


คุณสามารถเปลี่ยนเส้นทางไลบรารีฮาร์ดโค้ดเพื่อใช้ Libraries_get_path () หากคุณใช้ api ของไลบรารีหรือ drupal_get_path () หากคุณไม่ได้ใช้
masterchief


1

หากไฟล์ JS ของคุณไม่มีการขึ้นต่อกันสามารถรวมไฟล์ดังกล่าวไว้ในส่วนหัวของ HTML:

$selectivizr = array(
  '#tag' => 'script',
  '#attributes' => array(
    'src' => file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/selectivizr.js'),
  ),
  '#prefix' => '<!--[if lte IE 9]>',
  '#suffix' => '</script><![endif]-->'
);
drupal_add_html_head($selectivizr, 'selectivizr');

ถ้าคุณมีสมมุติว่า jQuery พึ่งพามันทำให้ใส่รหัสของคุณที่ด้านล่างของหน้า:

function THEMENAME_preprocess_html(&$vars){
  $vars['page']['page_bottom']['jquery_dependent_js'] = array(
    'footer' => array(
      '#type' => 'markup',
      '#markup' => '<!--[if lte IE 9]><script src="' .
        file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/jquery_dependent_js.js'). '"></script><![endif]-->',
    )     
  );
}

มีแท็กสคริปต์เพิ่มเติมในบล็อคโค้ดแรกของคุณในคีย์ #suffix
Pol Dellaiera
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.