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

Verificação C/ Input.

Bom dia estou com dificuldade na seguinte questão.

Gostaria de acrescentar dois input, aonde o usuário iria digitar Login e Senha em seguida iria fazer a verificação clicando no button porém o professor informou que querySelector nao era mãe de dináh devimos atribuir ("Input"). Então como declaro duas Tags input verifico se os dois estão corretos input ?

<meta charset="UTF-8">


<input>
<br>
<input>


<button> Entrar! </button>

<script>


  var login = "123";
  var senha = "312";

      function verifica () {

              var input = document.querySelector ("input");
              input.focus();


              if (input.value == login){

                  alert ("Entrada Permitida");
              }else{

                  alert ("Acesso Negado!");
              }

              input.value = "";
    }

    var button = document.querySelector ("button");
    button.onclick = verifica;


</script>
6 respostas
solução!

E aí, Rafael! Tudo certinho, cara? =)

Quando você usa o querySelector(), você está buscando um elemento na página. Quando você coloca input como parâmetro, você está dizendo que quer buscar o input da página. No caso, como você possui dois, ele lhe trará apenas o primeiro... =|

Para você conseguir buscar os dois, e ter certeza de qual está buscando, você pode utilizar um id! A primeira coisa a se fazer é atribuir um id para os input, assim:

<meta charset="UTF-8">

<input id="login">
<br>
<input id="senha">

<!-- Restante do código omitido -->

Agora, no seu script, você deve buscar o elemento baseado no ID que você acabou de atribuir, não no nome da tag, como você estava fazendo... Para isso, basta você usar o #:

// Código anterior omitido...

var login = document.querySelector("#login");
var senha = document.querySelector("#senha");

// Código posterior omitido...

Repare agora, que você consegue pegar os dois elementos, apenas informando qual o ID de cada um, sacou? =)

Espero ter ajudado, mas qualquer dúvida não deixe de postar por aqui, no fórum, para que possamos ajudá-lo, ok? =)

Abraço e bons estudos,

Fábio

Muito Obrigado uma parte resolvida , porém surgiu outra.

<meta charset="UTF-8">


<input id ="login">
<br>
<input id ="senha">


<button> Entrar! </button>

<script>


  var login = "123";
  var senha = "312";

      function verifica () {

            var input = document.querySelector ("#login");
            var input = document.querySelector ("#senha");
              input.focus();
              console.log(login);
              console.log(senha);


              if (input.value == login && input.value == senha){

                  alert ("Entrada Permitida");
              }else{

                  alert ("Acesso Negado!");
              }

              input.value = "";
    }

    var button = document.querySelector ("button");
    button.onclick = verifica;


</script>

Ao clicar no button , só me retorna acesso Negado!

Este trecho

if (input.value == login && input.value == senha)

input.value como especificar para ele buscar o valor input login e input senha e em único button fazer está verificação dos dois!

  • Gostaria que o usuário fizesse o login e comparasse a senha e login ao clicar no button e se ambos estivesse correto , desse acesso permitido caso um o outro tivesse divergente , desse acesso negado

O problema está na função verifica, você está lendo duas vezes o mesmo campo. Faça a seguinte alteração:

 function verifica () {

            var input_login = document.querySelector ("#login");
            var input_senha = document.querySelector ("#senha");
              input_login.focus();
              console.log(login);
              console.log(senha);


              if (input_login.value == login && input_senha.value == senha){

                  alert ("Entrada Permitida");
              }else{

                  alert ("Acesso Negado!");
              }

              input_login.value = "";
              input_senha.value = "";
    }

Suas dúvidas são todas respondidas no curso de JavaScript da própria Alura.

No curso de lógica só focamos o mínimo do JavaScript para que o aluno pratique lógica.

Ainda há mais um curso de lógica antes do curso de JavaScript. Seria interessante você faze-lo também antes de cair dentro na linguagem.

  • Agradeço a todos pelas respostas.

Professor: Flavio , obrigado , achei que faltava raciocínio logico da minha parte mas darei continuidade nos cursos.

Tranquilo. Muita coisa foi omitida de propósito para focarnos em lógica. Você aprenderá a buscar elementos da página de diversas formas.

O problema do verifica era de lógica, mas você já superou.

Temos um caminho cheio de surpresas pela frente no próximo curso!