Как определить главную страницу с помощью JavaScript

Question

Как определить главную страницу с помощью JavaScript

14 мар. 2017 г., 12:34:35

Просмотры: 19.8K

Голосов: 4

Я пробовал использовать is_front_page(), но это PHP-способ определения главной страницы. Возможно, я неправильно его вызываю, поскольку не получаю никакого ответа. Может быть, мне просто не хватает детального понимания способов доступа к классам WordPress через JavaScript.

То, что я пытаюсь сделать, довольно просто. Если я нахожусь на главной странице или домашней странице - добавить один класс, если нет - добавить другой класс. Очень просто, но это не работает. Я даже пробовал использовать псевдо-тег span и добавить класс к нему, но это тоже не работает.

SunRhythms

53

пользовательские типы записей записи css javascript

Комментарии

Вы пробовали использовать is_home вместо этого - WordPress по-разному обрабатывает главные страницы, состоящие из последних записей, и статические страницы. Кроме того, WordPress автоматически добавляет классы для главной страницы, поэтому, возможно, вам не нужны дополнительные классы?

physalis

14 мар. 2017 г. 12:49:18

Это может сработать, но, кажется, я пытаюсь получить доступ к PHP-функции через jQuery, что и вызывает основной конфликт (как я думаю).

SunRhythms

14 мар. 2017 г. 12:59:04

Честно говоря, я не знаю, что такое PHP-функция, но вы можете использовать функцию has_class() в jQuery для точного определения главной страницы. Или, если вам нужно, чтобы скрипт работал исключительно на главной странице, вы можете подключить его через PHP с условием is_home()/is_front_page().

physalis

14 мар. 2017 г. 13:10:37

ср. https://api.jquery.com/hasclass/

physalis

14 мар. 2017 г. 13:17:48

Все ответы на вопрос

Использование jQuery:

jQuery(document).ready(function($){
    if ( $('body').hasClass('home')) {
        $('.menu').addClass('absolute');
    } else {
        $('.menu').addClass('fixed');
    }
});

Dragos Micu

213

14 мар. 2017 г. 13:34:11

Комментарии

Метод get by class name не всегда поддерживается, и у меня никогда не получалось его использовать.

SunRhythms

14 мар. 2017 г. 14:09:50

Проверьте обновленный ответ с использованием jQuery.

Dragos Micu

14 мар. 2017 г. 14:22:26

Хороший ответ, но разве has class уже не является своего рода условием само по себе? Нужен ли if? Я видел, как это пишут без него, просто к слову. При написании jQuery для WordPress нужно изменить формат. Но спасибо. Это направляет меня в нужное русло, я попробую написать что-то и надеюсь, что сработает. Кстати, всё это нужно встроить в уже работающий и структурированный jQuery-документ для плагина, где я просто использую небольшое условие, потому что на главной странице у меня есть ротатор фоновых изображений во весь экран, и мне нужно, чтобы мой заголовок был поверх него с position: absolute. Это происходит только на главной странице.

SunRhythms

14 мар. 2017 г. 14:44:55

@SunRhythms Как видно из документации, метод hasClass возвращает логическое значение (Boolean), поэтому вы используете оператор IF, чтобы добавить класс при True, ИНАЧЕ добавить другой класс при False.

https://api.jquery.com/hasclass/

Dragos Micu

14 мар. 2017 г. 15:32:35

Вы можете использовать класс page-id. Если вы добавите класс page-id в ваш JavaScript файл, это может решить вашу проблему.

введите описание изображения

ferdouswp

22

14 мар. 2017 г. 12:49:24

Комментарии

Да, я знаю о классе страницы. Стоит ли использовать булево значение, например, если page Id === home, то делать то-то и то-то? CSS-адрес очень длинный, даже для области или div, который просто является headerwrapper

SunRhythms

14 мар. 2017 г. 12:54:46

Можно использовать, например, так:

if( $('body.page-id-6').length ){ // Выполнить действия }

ferdouswp

15 мар. 2017 г. 08:18:56

Проверенный ответ работает... это практически то же самое. спасибо

SunRhythms

17 мар. 2017 г. 04:51:50

RRikesh 5.66K · Accepted Answer · 2017-03-14T14:37:28Z

Я только что опубликовал ответ на другой вопрос о том, как это сделать.

В вашем случае, если вы использовали body_class() в своей теме, ваша домашняя страница должна иметь <body> с классом home.

Таким образом, в вашем JS вы можете сделать следующее:

if( $('body.home').length ){
  // Выполнить действия
}

RRikesh

5.66K

14 мар. 2017 г. 14:37:28