2017-02-15 13 views
0

Я перефазировал некоторые из моих шаблонов и поместил ссылку на код jQuery внизу моих файлов шаблонов, чтобы быстро поддерживать скорость загрузки страницы.Ввод jQuery в нижней части моих HTML-шаблонов является негибким

У меня также есть некоторые модули javascript, которые я использую только на определенных страницах, поэтому я не включаю их в основной шаблон, а скорее из содержимого.

Вот как шаблоны выглядят ....

<html> 
    <head> 
    </head> 
    <body> 

     <!-- navigation --> 
     <nav></nav> 
     <!-- end navigation --> 

     <!-- main content --> 
     <?php $this->load->view($module . '/' . $view_file); ?> 
     <!-- end main content --> 

     <!-- footer --> 
     <footer></footer> 
     <!-- end footer --> 

     <!-- javascript dependencies --> 
     <script src="<?php echo base_url('bower_components/jquery/dist/jquery.min.js'); ?>"></script> 

    </body> 
</html> 

Если добавить заказной код расслоения плотного конкретной страницы внутри шаблона, как это:

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 

     <!-- navigation --> 
     <nav></nav> 
     <!-- end navigation --> 

     <!-- main content --> 
     <?php $this->load->view($module . '/' . $view_file); ?> 
     <!-- end main content --> 

     <script src="some custom js that uses jQuery"></script> 

     <!-- footer --> 
     <footer></footer> 
     <!-- end footer --> 

     <!-- javascript dependencies --> 
     <script src="<?php echo base_url('bower_components/jquery/dist/jquery.min.js'); ?>"></script> 

    </body> 
</html> 

Я получаю ошибки

ReferenceError: $ is not defined 

Так что я должен поместить свои jQuery и другие зависимости в голову документа или есть другой способ?

+0

JQuery должен быть загружен до использования любого кода jquery, поэтому файл должен пройти выше кода. Вот почему он обычно помещается в заголовок. – tigerdi

ответ

1

Эта ошибка возникает из-за того, что сценарий запущен до загрузки jQuery, поэтому он не определен.

Чтобы исправить это, просто разместите свой собственный скрипт в строке под импортом jQuery и он должен работать.

В качестве альтернативы, поставьте jQuery import выше на странице, чтобы он всегда превышал ваши пользовательские сценарии, и он будет работать.

+0

Проблема в том, почему она негибкая ... Я должен включать КАЖДЫЙ js-фрагмент на КАЖДОЙ странице, даже если этот фрагмент используется на одной странице ... Я хочу включить только фрагменты на одной странице ... –

+1

Не совсем , все, что вам нужно сделать, это обеспечить загрузку jQuery перед вашими фрагментами, например, загрузив его вверху страницы. Если вам кажется, что это очень раздражает, вы можете просто отключить jQuery и написать все свои фрагменты в ванильном JavaScript! – Sean

+1

Никогда! Хорошо, поэтому мне нужно включить мой jQuery перед моим основным контентом. –