Как добавить php-код Wordpress в JavaScript

У меня есть следующий код javascript:

$(window).scroll(function() {
    if ($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-default').addClass('sticky');
        $('.navbar-brand img').attr('src','assets/images/logo.png'); //change src
    } else {
        $('.navbar-default').removeClass('sticky');
        $('.navbar-brand img').attr('src','assets/images/logo__footer.png')

    }
});

Можно ли вставить собственный PHP-код wp

<?php the_custom_logo(); ?>

Вместо этого статического атрибута

.attr('src','assets/images/logo.png');

Спасибо заранее.

Создан ли этот javascript как часть php-скрипта или он находится в файле .js, на который вы ссылаетесь на страницу

— 18.10.2018 10:36

@RiggsFolly Привет, это часть js файла

— 18.10.2018 10:37

Тогда я думаю, что ответ - нет, не прямо.

— 18.10.2018 10:38

javascript php wordpress

18.10.2018 10:34

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

Вам нужно установить переменную в шаблоне:

<script>
    var logoImage = <?php the_custom_logo(); ?>;
    var logoImageFooter = <?php the_custom_logo()?> //here footer logo
</script>

а затем в вашем js файле используйте его

$(window).scroll(function() {
    if ($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-default').addClass('sticky');
        $('.navbar-brand img').attr('src',logoImage); //change src
    } else {
        $('.navbar-default').removeClass('sticky');
        $('.navbar-brand img').attr('src',logoImageFooter)

    }
});

Привет @ vasyl-zhuryk, большое спасибо. Не могли бы вы сообщить мне, в каком именно шаблоне мне нужно установить переменную?

— 18.10.2018 10:49

@Jamdev Теперь у меня нет сервера Wordpress, и я не вижу файл. Но вы можете найти это сами. html в вашем модуле, который загружается вместе с вашим js файлом

— 18.10.2018 12:24

Очень признателен!

— 18.10.2018 13:22

18.10.2018 10:41

Ваш Js-код:

$(window).scroll(function() {
    if ($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-default').addClass('sticky');
        $('.navbar-brand img').attr('src','custom_logo.png'); //change src
    } else {
        $('.navbar-default').removeClass('sticky');
        $('.navbar-brand img').attr('src','logo_footer.png')

    }
});

HTML код:

<?php $customLogo= 'custom_logo'; ?>
<?php $footerLogo= 'footer_logo'; ?>
<html>
  <body>
    <script type = "text/javascript">  
      // notice the quotes around the ?php tag         
      var customLogo = "<?php echo $customLogo; ?>";
      var footerLogo = "<?php echo $footLogo; ?>";
      alert(customLogo);
      alert(footerLogo);
    </script>
  </body>
</html>

18.10.2018 10:49

ЕСЛИ вам нужен jquery с вводом кода php, тогда функция wp_localize_script(). Больше информации

 var logoImage = <?php the_custom_logo(); ?>;
var logoImageFooter = <?php the_custom_logo()?> //here footer logo

// Register the script
wp_register_script( 'some_handle', 'path/to/myscript.js' );

// Localize the script with new data
$translation_array = array(
    'logo_image' => the_custom_logo(),
    'logo_image_footer' => the_custom_logo()'
);
wp_localize_script( 'some_handle', 'object_name', $translation_array );

// Enqueued script with localized data.
wp_enqueue_script( 'some_handle' );

Вы можете получить доступ к переменным в JavaScript следующим образом:

    <script>
        alert( object_name.logo_image);
        alert( object_name.logo_image_footer);
    </script> 


 $('.navbar-brand img').attr('src',object_name.logo_image); //change src

18.10.2018 11:45

Другие вопросы по теме

Передача измененных пользовательских свойств в auth

Подобное имя переменной или файла в Программировании

Как сделать решения для преобразования массивов в строки?

Тестирование с помощью phpunit метод try catch store для проверки исключения

CURL PHP возвращает странную строку

Изображение удалено при обновлении другой записи в php mysqli

Хранилище правил безопасности Firebase с определенного веб-адреса

Отображение списка мета постов в зависимости от массива идентификаторов постов в wordpress

Регулярное выражение шорткода в Php

Пустые данные, сохраненные запросом mysql на странице формы

Как добавить php-код Wordpress в JavaScript

Ответы 3

Другие вопросы по теме

Похожие вопросы