Javascript effect

Asked

Viewed 173 times

2

Good evening everyone. I am writing a script in which it has the function of multiplying the value typed in inputs and give me the result I want to know.

How do I type, for example: 100,00, he give me the value and call a picture below the input "outworking".

I’ll set up the 50x50 image that will be hidden, like:

<img src="teste.jpg" style="display:none"> 

Then I’ll put the value from 90 to 100, and when I type between those values will call this image "test.jpg" below the input.

I’ve tried with if{}else{}. If anyone can help me I’d be very grateful.

This is the code:

<html>
<head>
    <meta charset="utf-8">
    <style>
        #demo3 { display: none;}
        #resultado {margin-left: 500px;}
    </style>
</head>
   <body>
   <script src="jquery.min.js" type="text/javascript"></script>
    <script src="jquery.maskMoney.js" type="text/javascript"></script>
<script> 
function soma() 
{
    var valor;
    var campo = form.campo1.value;
    if(campo >=1  && campo < 99){
        valor=23;
    }else{
        valor=25;
    }
    form.campo4.value = parseInt(campo) * parseInt(valor) 
}

  function limitarInput(obj) {
    obj.value = obj.value.substring(0,8);
  }
</script>
<form name="form">
<input name="campo1" id="demo4"><br> 
<input name="campo2" value="" id="demo3"><br>  
<input name="campo4" readonly id="resultado"><br>
<input type="button" onclick="soma()" value="CALCULAR">
</form>
<img src="teste.jpg" style="display:none">
   </body>
</html>

1 answer

2


If I understand your question correctly, just change the display of the image when the values meet the suggested criteria, using if.

Note: it is important to assign a id image to facilitate its manipulation:

<img id="imagem" src="teste.jpg" style="display:none">

It is therefore sufficient to add if to its function soma():

if(campo >= 90 && campo <= 100){
    // torno o valor display da imagem vazio, assim ela será exibida
    document.getElementById("imagem").style.display = "";
}

function soma() 
{
    var valor;
    var campo = form.campo1.value;
    if(campo >=1  && campo < 99){
        valor=23;
    }else{
        valor=25;
    }
	
if(campo >= 90 && campo <= 100){
	document.getElementById("imagem").style.display = "";
}
    form.campo4.value = parseInt(campo) * parseInt(valor) 
}

  function limitarInput(obj) {
    obj.value = obj.value.substring(0,8);
  }
<form name="form">
<input name="campo1" id="demo4"><br> 
<input name="campo2" value="" id="demo3"><br>  
<input name="campo4" readonly id="resultado"><br>
<input type="button" onclick="soma()" value="CALCULAR">
</form>
<img id="imagem" src="https://d30y9cdsu7xlg0.cloudfront.net/png/76060-200.png" style="display:none">

  • Thank you I will test here on the project I am doing, if I wanted for more than one image is just I assign another IF ? with the value I desire ?

  • If the value you want to check on if is another, can for yes.

  • Thanks Dvdsamm ! I tested here it worked super right you are too :)

Browser other questions tagged

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