Javascript image

Asked

Viewed 83 times

-6

I need the user to write a correct password and an image will appear

<html>
    <head>
        <title>SENHA</title>
    </head>
</html>

<script>
    var senha = ('teste')
    var escrita = (window.prompt('SENHA'))

    if(senha == escrita){
        document.write("S")
    }else{
        document.write("N")
    }
</script> 

2 answers

-3

I think you want something like this.

imgacertou = document.getElementById('Acertou')
senha = document.getElementById('senha')
confirmabtn = document.getElementById('Confirma')
TextoDaTela = document.getElementById('PedirSenha')

confirmabtn.addEventListener('click', function() {

if(senha.value == 'SenhaCorreta'){
   senha.value = '' //Limpar a area de texto
  
   confirmabtn.style.display = 'none'
   senha.style.display = 'none'
   TextoDaTela.style.display = 'none'
   
   imgacertou.style.display = 'block'

  }



})
#Acertou{
display: none;
width: 100px;
heigh: 100px;
}

#PedirSenha {
display: block
}

#senha {
display: inline-flex;
}

#Confirma {
display: inline-flex;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>


<img id='Acertou' src='https://gartic.com.br/imgs/mural/of/ofantasmazul/acertar.png'>

<h1 id='PedirSenha'>Digite a senha</h1>

<input id='senha' type='password' required></input>
<button id='Confirma'>Confirmar</button>

</body>
</html> 

-4


Much of the code you provided was correct. Only what was missing was you printing the image object inside your HTML thus below.

let senha = "teste";
let escrita = window.prompt("SENHA");

if(senha === escrita){
   document.write(`<img src="https://via.placeholder.com/350x90.png?text=ACERTOU!">`);
}else{
   document.write(`<img src="https://via.placeholder.com/350x90.png?text=ERROU!">`);
}

you can also include using jquery this way:

 let senha = "teste";
    let escrita = window.prompt("SENHA");
    
    if(senha === escrita){
       $("#seuobjetopodeserumadiv").html(`<img src="https://via.placeholder.com/350x90.png?text=ACERTOU!">`);
    }else{
       $("#seuobjetopodeserumadiv").html(`<img src="https://via.placeholder.com/350x90.png?text=ERROU!">`);
    }
  • vdd vc has reason.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.