2

O erro apareceu após eu tentar adicionar o .click(function())

Como é possível ver na imagem acima, o resultado não é o esperado, que seria que o h1 ficasse da cor laranja, com um fadeIn, e uma função onclick.

JQuery:

$(document).ready(function(){


$('h1')
.css("color","#f66")
.hide()
.delay('1000')
.fadeIn("slow")
.text('Teste')
.click(function()){
    $('body').css("background","#C30")
    $('h1').css("color","#fff");


});
});

HTML:

<body>
<h1>Teste aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</h1>
<a href="#">1</a>
<a href="#" class="link 2">1</a>    
<a href="#" id="link3">1</a>

Eu já verifiquei, e a CDN está correta. Obrigado desde já!

4
  • Não está indo pelo caminho certo não amigo!
    – LeAndrade
    15/09/2018 às 20:57
  • O erro só aconteceu após eu adicionar a parte do .click(function)()), porque antes estava funcionando corretamente, com o fadeIn e o color funcionando 15/09/2018 às 20:59
  • Bom eu sinceramente não entendi o que você quer fazer. Mas no código você está cheio de }); sobrando!
    – LeAndrade
    15/09/2018 às 21:13
  • É apenas um teste amigo, estou apenas testando o uso do Jquery, por isso que eu coloquei tanta coisa, vou editar e mostrar o código completo 15/09/2018 às 21:15

2 Respostas 2

2

Basta rearanjar seu script

inicialmente setar a cor do h1 é incoerente pois já entra hidden.

   $(document).ready(function(){

        $('h1').css("color","#f66");
        $('h1').hide();
        $('h1').delay(1000);
        $('h1').fadeIn("slow");
        $('h1').text('Teste');

        $('h1').click(function(){
            $('body').css("background","#C30");
            $('h1').css("color","#fff");
       });

    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  <body>
    <h1>Teste aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</h1>
    <a href="#">1</a>
    <a href="#" class="link 2">1</a>    
    <a href="#" id="link3">1</a>

1

O seu problema é apenas um erro de sintaxe. Há um parênteses indevido nesta linha:

.click(function()){
                 ↑

O correto seria:

.click(function(){

Com a correção tudo funciona como previsto:

$(document).ready(function(){
   $('h1')
   .css("color","#f66")
   .hide()
   .delay('1000')
   .fadeIn("slow")
   .text('Teste')
   .click(function(){
       $('body').css("background","#C30")
       $('h1').css("color","#fff");
   });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Teste aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</h1>
<a href="#">1</a>
<a href="#" class="link 2">1</a>    
<a href="#" id="link3">1</a>

1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .