Solucionado (ver solução)
Solucionado
(ver solução)
11
respostas

Função startsWith

Olá, eu resolvi implementar a função startsWith(), porém minha borda só fica da cor vermelha. Já tentei de vários modos aqui e não consegui com que ela ficasse verde, em caso de acerto.

Como eu posso implementar essa função, de modo que apareça a cor respectiva?

O código:

function inicializaMarcadores() {
  var frase = $(".frase").text();
  campo.on("input", function() {
    var digitado = campo.val();
    var comparavel = frase.substr(0, digitado.length);

    if (frase.startsWith(digitado)) {
      campo.addClass("borda-verde");
      campo.removeClass("borda-vermelha");
    } else {
      campo.addClass("borda-vermelha");
      campo.removeClass("borda-verde");
    }
  });
}

O var "comparável" não foi inicializado, pois eu substituí o operador lógico no if pela função startsWith(), daí não sei se o erro pode estar nesse fator..

11 respostas

Fala ai Philippo, tudo bem? Olhando os códigos parecem estar certos.

Sugiro você adicionar um log para ver o valor de cada variável:

console.log(frase)
console.log(digitado)

Adicione o log antes do if e compare as duas saídas.

Espero ter ajudado.

Blz, Matheus! Obrigado pela ajuda!!

Só mais uma dúvida: o fato de o var "comparavel" não ter sido chamado por nenhum comando pode influenciar na aparição da cor?

solução!

Fala ai Philippo, olhando a parte do seu código ele não deveria influenciar não.

Espero ter ajudado.

Entendi! Obrigado mais uma vez, Matheus!

Magina, sempre que precisar não deixe de criar suas dúvidas.

Abraços e bons estudos.

Eu resolvi abrir a página no Mozilla e funcionou! Eu estou na aula de fadeOut() agora e esse comando também não estava funcionando no Chrome. Aí resolvi abrir no Mozilla, e ambos funcionaram. Não sei se há uma declaração do código diferente para o Chrome/Safari...

Matheus, eu consegui resolver aqui! Eu testei com o console.log(), como você recomendou, e o console.log(digitado) imprimia o que eu escrevia, sem comparar com o texto que era para ser copiado, já o console.log(comparavel) imprimia o texto exatamente como estava no HTML, ignorando o que eu escrevesse no textarea. Daí fui analisando e consegui retornar a função caso esteja certo (borda verde) ou errado (borda vermelha).

O código:

function inicializaMarcadores() {
  var frase = $(".frase").text();
  campo.on("input", function() {
    var digitado = campo.val();
    var comparavel = frase.substr(0, digitado.length);

    if (digitado.startsWith(comparavel)) {
        campo.addClass("borda-verde");
        campo.removeClass("borda-vermelha");
      } else {
        campo.addClass("borda-vermelha");
        campo.removeClass("borda-verde");
      }
  });
}

Como o var frase pega exatamente o que estava na classe .frase, comecei a trabalhar em cima dele e vi a possibilidade de trocá-lo pelo var digitado, na condição if, ao chamar a função startsWith(). Já estava me dando agonia demais haha mas deu pra resolver rs

Boa Philippo, fico feliz que tenha resolvido o problema.

Desculpa a demora, estava bem corrido as coisas por aqui.

Sempre que precisar não deixe de criar suas dúvidas.

Abraços e bons estudos.

Sem problemas, Matheus! Aqui está bastante corrido também (final do período da faculdade haha)! Mas obrigado pela atenção e predisposição em ajudar!

Abraço!

Magina, sempre que precisar não deixe de criar suas dúvidas.

Abraços e bons estudos.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software