Передача переменной из функции PHP в JS

Question

Я только что создал свой первый плагин Wordpress, который создает ротатор с функцией callback, который будет помещен в файлы шаблонов тем. Основная функция ..

function thinkup_testimonials(){ 
    if (is_active_sidebar('thinkup-testimonials')) : 
    echo '<!-- Testimonials --> 
     <div id="thinkup-testimonials" class="flexslider"> 
     <ul class="testimonials slides">'; 
     dynamic_sidebar('thinkup-testimonials'); 
    echo'</ul></div><!-- testimonial section -->'; 
    endif; 
} 

Таким образом, пользователи называют thinkup_testimonials(); в своем шаблоне и все хорошо.

Моя проблема в том, что я хочу, чтобы пользователи могли контролировать время между слайдами в ротаторе (объявленном в JS-файле) простым способом.

Я стремился иметь их объявить thinkup_testimonials(9000); в своих шаблонах, и это установило бы время 9 секунд. Следуя указаниям @Madara Uchicha от this post! Я решил попробовать №2. Повторите отправку данных на страницу и используйте JavaScript для получения информации из DOM. Таким образом, я изменил функцию выше, чтобы быть так ..

function thinkup_testimonials($settime){ 
    if (is_active_sidebar('thinkup-testimonials')) : 
    echo '<!-- Testimonials --> 
      // Creates hidden HTML element with time delay 
      <input type="hidden" class="tut-timer" value="'. $settime . '"> 
      <div id="thinkup-testimonials" class="flexslider"> 
      <ul class="testimonials slides">'; 
      dynamic_sidebar('thinkup-testimonials'); 
    echo'</ul></div><!-- testimonial section -->'; 
    endif; 
} 

И в JS, чтобы идти вместе с этим теперь ..

jQuery(document).ready(function($) { 

      var timer = $('input.tut-timer').val(); 
      console.log(timer) 

      $('#thinkup-testimonials').flexslider({ 
       slideshow: true, 
       animationDuration: 200, 
       slideshowSpeed: 'timer' 
      }); 
     }); 

В то время как это, кажется, по крайней мере, передать переменную $settime правильно и выводить его с console.log(), но ..

1. Я получаю Синхронный XMLHttpRequest на основной поток является устаревшим из-за его пагубные эф ts к опыту пользователя
2. Эта переменная, кажется, не прошла успешно в args flexslider.
3. Я также хотел бы установить значение по умолчанию для $ settime в PHP, чтобы пользователи, не передающие значение в функции обратного вызова, также имели базовый стандарт 5 секунд. Я пробовал использовать if(!isset($settime)){$settime = 5000}; в начале моего thinkup_testimonials(); но он вызывает фатальные ошибки. Некоторые указатели на это тоже были бы удивительными.

Вы можете видеть, что здесь живут http://www.thinkupdesign.ca/testimonials-plugin/

Спасибо большое за любую помощь вы можете предоставить!

Answer 1

Вместо использования скрытого ввода вы можете использовать атрибуты data-.

Значение, возвращаемое с ввода, будет строкой, а не числом, поэтому вам нужно знать, какой тип вы передаете как значение для параметров плагина.

Try что-то вроде:

<ul class="testimonials slides" data-timer="'.$settime.'"> 

Тогда в JS

var $slider = $('#thinkup-testimonials'), 
    timer = +$slider.data('timer'); 

    $slider.flexslider({ 
       slideshow: true, 
       animationDuration: 200, 
       slideshowSpeed: timer /// note you were using string not variable here 
    }); 

Если вы хотите, чтобы сделать это более гибким для пользователей, вы можете передать дополнительные параметры в качестве атрибутов и извлечения, как один объект с помощью $slider.data() который вы можете использовать для расширения значений по умолчанию:

var sliderDefaults={ 
    slideshow: true 
} 
var userOpts = $.extend(sliderDefaults, $slider.data()); 
$slider.flexslider(userOpts); 

Answer 2

Ну, «Synchro» nous XMLHttpRequest ", потому что в какой-то момент ваш JS-код должен делать синхронный запрос ajax на сервер, я не думаю, что это не имеет никакого отношения к тому, как вы передаете переменную от PHP к JS.

Второй момент, потому что вы должны передать из параметров в FlexSlider без кавычек:

 $('#thinkup-testimonials').flexslider({ 
      slideshow: true, 
      animationDuration: 200, 
      slideshowSpeed: timer 
     }); 

И третье, просто попробовать это, скажем, для значения по умолчанию 5000:

function thinkup_testimonials($settime=5000){ 
    ....