У меня сайт Wordpress настроен на моей локальной машине, где я создаю собственную тему. В файле 'enqueue-assets. php' я использую wp_enqueue_script для загрузки файла javascript основного пакета. В этот комплект входит дополнительный импорт других. js файлов. В одном из импортированных. js файлов есть следующая функция:
function svgPageJump(target){
alert(target);
}
Я также пытался присвоить функцию переменной, просто чтобы убедиться, что я получил те же результаты, объясненные ниже:
let svgPageJump = function(target){
alert(target);
};
и
var svgPageJump = function(target){
alert(target);
};
Когда я вызываю эту функцию в том же файле. js с .ready ():
$(document).ready(function(){
svgPageJump('section-plan');
});
Я получаю предупреждение при загрузке страницы , как и ожидалось. Я также получаю предупреждение, просто вызывая его после объявления функции (также, как и ожидалось).
К сожалению, это не работает для событий щелчка в других местах на странице. В конечном итоге я пытаюсь заставить эти события срабатывать при нажатии элементов в SVG, чтобы создавать переходы страниц. На интерактивных элементах, которые я использую:
onclick="top.svgPageJump('section-plan');"
Нажатие на элемент дает мне эту ошибку:
Uncaught TypeError: top.svgPageJump is not a function
at SVGGElement.onclick
Сначала я подумал, что это проблема таргетинга из SVG, но Я сделал еще один тест на части текста в другом месте на странице. В заголовочном блоке Гутенбурга на странице Wordpress я разместил следующую разметку с помощью редактора HTML для блока:
<h2 id="section-plan" onclick="svgPageJump('section-plan');">PLAN</h2>
Я также сделал это в пользовательском блоке HTML, но в любом случае, когда Я нажимаю h2 на текущей странице и получаю эту ошибку:
Uncaught ReferenceError: svgPageJump is not defined
at HTMLHeadingElement.onclick
Я явно что-то упускаю (возможно, что-то простое), но не уверен, как отследить проблему между файлами темы (которые все работает правильно, иначе) или событие, определяемое на странице через администратора Wordpress, или ...?
Еще одно замечание по этому вопросу ... Первоначально я использовал более простой подход к выполнению этих переходов по страницам с использованием тегов привязки и связанные идентификаторы. Это работало нормально, но у меня есть липкий заголовок на странице, поэтому, когда страница прокручивается, элемент с идентификатором прокручивается под заголовком, поэтому я пытаюсь использовать JavaScript / jQuery для учета высоты заголовка.
Спасибо!