Отдельная функция JavaScript на отдельной странице WordPress

62
3

Я прочитал несколько статей о том, как добавить JavaScript на страницы WordPress, хотя это кажется слишком сложным для того, что мне нужно. У меня есть этот небольшой скрипт (см. Ниже), и я хочу, чтобы он работал только на одной странице. Я думал добавить его в теги <script> после того, как основной контент выполнит трюк, но я получаю следующую ошибку в консоли:

Uncaught TypeError: undefined не является функцией

Несмотря на то, что сценарий отлично работает на консоли, он не работает.

Для этого скрипта я должен использовать сложные методы или есть более простой?

$('#tSubmit').on('click', function() {
var amt = +$('#tCount').val(),
tier = $('#tType').val(),
h = +$('#tH').val() > 0 ? +$('#tH').val() : 0,
m = +$('#tM').val() > 0 ? +$('#tM').val() : 0,
s = +$('#tS').val() > 0 ? +$('#tS').val() : 0,
time = ((h*60+m)*60+s)/amt;
alert('Individual time for Tier ' + tier + ' troops: ' + time.toFixed(2) + ' seconds');
});

спросил(а) 2021-01-28T00:56:05+03:00 3 месяца, 1 неделя назад
1
Решение
98

В WordPress jQuery загружается с помощью функции jQuery.noConflict(), что означает, что переменная $ aliased для jQuery чтобы не противоречить другим библиотекам Javascript.

Вы можете включить ваш javascript в свой шаблон страницы или даже в содержимое сообщения (если вы используете текстовый редактор, а не визуальный), если вы замените $ на jQuery.

jQuery('#tSubmit').on('click', function() {
var amt = +jQuery('#tCount').val(),
tier = jQuery('#tType').val(),
h = +jQuery('#tH').val() > 0 ? +jQuery('#tH').val() : 0,
m = +jQuery('#tM').val() > 0 ? +jQuery('#tM').val() : 0,
s = +jQuery('#tS').val() > 0 ? +jQuery('#tS').val() : 0,
time = ((h*60+m)*60+s)/amt;
alert('Individual time for Tier ' + tier + ' troops: ' + time.toFixed(2) + ' seconds');
});

Если вы не хотите изменять код, вы можете передать переменную jQuery в функцию, которая принимает $ в качестве аргумента и использует ваш код как есть.

(function($){
// your code goes here and jQuery is known as $
// $(document).on()... or whatever
})(jQuery);

ответил(а) 2021-01-28T00:56:05+03:00 3 месяца, 1 неделя назад
44

Почему бы вам не попробовать создать отдельный js файл для этой функции (а также выполнить его на jQuery (document).ready()), а затем обратиться к нему со своей страницы с помощью wp_enqueue_script ('scrip name', 'script url ', array (' jQuery ')). Это приведет к загрузке вашего скрипта после загрузки jQuery.

ответил(а) 2021-01-28T00:56:05+03:00 3 месяца, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема