Articles

How to fix WordPress “Uncaught TypeError: $ is not a function” jQuery Error?

Como você pode ter notado durante o WordPress desenvolvimento, às vezes é muito difícil descobrir como colocar o script de maneira correta?

Devo apenas adicionar um programa na parte inferior da Página no rodapé? Devo adicionar script noheader do site WordPress? Bem, há alguns padrões estabelecidos pelo WordPress framework que todos devem seguir.

neste tutorial, veremos como colocar o script Typed.min.js caminho certo para o seu tema WordPress e corrigir Uncaught TypeError: $ is not a function jQuery erro.

este tutorial irá ajudá-lo se tiver alguma das questões abaixo:

  • Como adicionar adequadamente JavaScripts e estilos no WordPress
  • Como colocar Scripts e estilos no WordPress?
  • Carregando CSS e JavaScript no WordPress da maneira certa

vamos entender o cenário primeiro:

para o meu outro site Premium, eu queria usar Typed.min.js com opções de enqueue WordPress corretas.

ao trabalhar na configuração acima do efeito, encontrei um erro estranho que nunca tinha enfrentado antes. Veja este erro abaixo:

acima ocorreu o erro antes da forma errada de incluir jQuery no meu site.

antes de utilizar colocar o código abaixo no rodapé manualmente:

caminho Errado para ajax

1
2
3
4
5
6
7
8
9
10
11
12
13

<script src=”https://code.jquery.com/jquery-1.12.4.min.js”></script>
<script src=”https://pro.crunchify.com/typed.min.js” type=”text/javascript”></script>
<script>
$(function(){
$(“.element”).typed({
strings: ,
typeSpeed:100,
backDelay:3000,
loop:true
});
});
</script>

After – Right way to enqueue script in functions.php

caminho Certo para colocar o script no tema WordPress

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

função typed_script_init() {
wp_enqueue_script( ‘typedJS’, ‘https://pro.crunchify.com/typed.min.js’, array(‘jquery’) );
}
add_action(‘wp_enqueue_scripts’, ‘typed_script_init’);
function typed_init() {
echo ‘<script>
jQuery(function($){
$(“.element”).typed({
strings: ,
typeSpeed:100,
backDelay:1000,
loop:true
});
});</script>’;
}
add_action(‘wp_footer’, ‘typed_init’);

Há duas coisas no código acima:

  1. Primeiro de tudo, nós estamos usando wp_enqueue_script função que tem o 3º parâmetro de usar jQuery carregado com o WordPress. Não há necessidade de adicionar jQuery manualmente 🙂 . Esta é a maneira certa de enqueue script no wordpress.
  2. Nós também mudou de função $(function(){jQuery(function($){, a fim de corrigir Uncaught TypeError: $ is not a function erro.

Hope this will help you fix and enqueue jQuery error on your site.

por sugestão do commiter Jaikangam, Aqui estão mais algumas opções para corrigir este erro:

Se você tem o arquivo crunchify.js então outra opção é iniciar o arquivo assim.

Option-1)

1
2
3
4
5
6

(function($){
$(document).ready(function(){
// write code here
});

Option-2)

1
2
3
4
5
6

jQuery(document).ready(function(){
// write code here
});
})(jQuery);

Feliz blogs.