it-roy-ru.com

Проблема с загрузкой JavaScript в нижнем колонтитуле

Я написал небольшой плагин, где я загрузил следующие скрипты

wp_enqueue_script('jquery', plugins_url('/js/jquery.min.js', __FILE__),'','1.7',true);
wp_enqueue_script('new-cycle', plugins_url('/js/cycle.js', __FILE__),array( 'jquery' ),'1.0',true);
wp_enqueue_script('new-jcarousellite', plugins_url('/js/jcarousellite.js', __FILE__),array( 'jquery' ),'1.0',true);
wp_enqueue_script('new-fancybox', plugins_url('/js/fancybox.js', __FILE__),array( 'jquery' ),'1.0',true);

и у меня также есть код javascript для вызова цикла и функций fancybox (с параметрами/опциями, загруженными из опций и таблиц post_meta)

function front_js(){ ?>   
<script>
    $(document).ready(function(){
      $(".video-popup").fancybox();
      $(".video_msgs").cycle({speed:'<?php echo get_option("cycle_speed");?>'});
    });
    </script>
<?php }

этот код добавляется в нижний колонтитул с помощью add_action('wp_footer', 'front_js');

Теперь мой код JavaScript загружается до того, как все необходимые сценарии, такие как

<script>
$(document).ready(function(){
  $(".video-popup").fancybox();
  $(".video_msgs").cycle();
});
</script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/themes/twentyfifteen/js/functions.js?ver=20141212'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/myplugin/js/cycle.js?ver=1.0'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/myplugin/js/jcarousellite.js?ver=1.0'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/myplugin/js/fancybox.js?ver=1.0'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/myplugin/js/counter.js?ver=1.0'></script>

и дает ошибку $('...').fancybox() не функция

Я думаю, потому что код загружается перед файлом fancybox.js, где написана эта функция. Я пытался распечатать функции print_scripts, но его рекомендуется не использовать, а wp_enqueue_script работает только с файлами, не имеющими пользовательский код JavaScript.

Есть ли способ загрузить мой пользовательский код после загрузки необходимых файлов или любой другой способ решения этой проблемы.

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

1
Vikram Singh

Попробуйте добавить код в нижний колонтитул, используя add_action('wp_footer', 'front_js', 99);, где 99 указывает порядок, в котором выполняются функции. Теперь он должен быть выполнен после загрузки ваших скриптов.

1
Stefan

Вместо того, чтобы помещать код в функцию и подключать его к wp_footer.

Вы можете сохранить другой файл JS в папке плагинов и поставить его в очередь, как и другие сценарии, которые вы поставили в очередь.

OR

<?php
function front_js() {
  if ( wp_script_is( 'jquery', 'done' ) ) {
?>
<script type="text/javascript">

$(document).ready(function(){
      $(".video-popup").fancybox();
      $(".video_msgs").cycle();
    });

</script>
<?php
  }
}
add_action( 'wp_footer', 'front_js' );
?> 
0
Abhishek Deshpande