Correct way to hide an HTML input using javascript

Question

Correct way to hide an HTML input using javascript

Navigation

#1 by (1 votes)

0

I have my html code has two input: payment and total I have implemented a script with the keyup method to verify that the payment is greater than the total and show the input of type submit.

The input of type submit is shown only if the payment is greater than the total

This is my code:

<!DOCTYPE html>
<html>
<body>

<input type="text" id="x" onkeyup="myFunction()">
<input type="text" id="y" value="8">
<div id="boton"></div>

<script>
function myFunction() {
    var x = Parsefloat(document.getElementById('x'));
    var y = Parsefloat(document.getElementById('y'));
    if(x>=y){
    document.getElementById("boton").innerHTML="<input type="submit" id="boton">";

}
</script>

</body>
</html>

However, I have not achieved the validation, I will appreciate your suggestions

javascript html

asked by paul zapata 13.08.2018 в 02:22

source

1 answer

Java only 2 decimal places [duplicated] Change Column by Row when typing Excel with Java

score 1 · Accepted Answer

To show or hide elements you can do them with the property display none in css.

You can try something like this

<!DOCTYPE html>
<html>

<body>

  <input type="text" id="x" onkeyup="myFunction()" /> <br>
  <input type="text" id="y" value="8" /> <br>
  <button type="submit" id="boton" style="display:none"> Algun texto </button>

  <script>
    function myFunction() {
       var x = parseFloat(document.getElementById('x').value);
       var y = parseFloat(document.getElementById('y').value);

      if (x >= y) {
        document.getElementById("boton").style.display = "block";
      } else {
        document.getElementById("boton").style.display = "none";
      }
    }
  </script>

</body>

</html>

Note a couple of changes I made, for example parseFloat, the first is lowercase and the uppercase is F. Also the assignment of the value property, in the parseFloat.

Look here for the example working link