У меня есть созданное пользовательское поле Radio Button с тремя вариантами:
В моем шаблоне страницы у меня есть 2 элемента div, содержащие изображение объекта, один из которых является баннером, а другой - встроенным, расположенным под заголовком, с классами «banner-feature-image» и «inline-feature-image» соответственно.
Я бы хотел {display: none;} класс «inline-feature-image», когда выбрана опция ACF «banner».
Я бы хотел {display: none;} класс «banner-feature-image», когда выбран ACF «inline».
И я хотел бы {отображать: нет;} оба класса «banner-feature-image» и «inline-feature-image», когда выбрана опция ACF «none».
Я только начинаю изучать javascript, и, судя по тому, что я собрал из информации в Интернете, я не могу заставить эту функцию работать.
Я пробовал много вариантов этого.
var image_location = get_field( "feature_image_location" );
var inline_feature_image = document.getElementsByClassName('inline-feature-image');
var banner_feature_image = document.getElementsByClassName('banner-feature-image');
if( image_location == 'banner') {
inline_feature_image.style.display = 'none !important';
}
if( image_location == 'inline') {
banner_feature_image.style.display = 'none !important' ;
}
if( image_location == 'none') {
banner_feature_image.style.display = 'none !important';
inline_feature_image.style.display = 'none !important';
}
Также некоторая помощь с тем, где его поставить. Я использую плагин Code Snippets для некоторых других вещей, но иногда он работает, а иногда нет (предположим, потому что Code Snippets предназначен для PHP?).
Любая помощь будет принята с благодарностью.
Ура Кристиан