Text box execute function when externally assigned a value to it in Javascript and HTML

2

I wanted to make a textbox perform a function when I assign a value to it by code, without user interaction.

I have tried the events onChange , onInput , onKeypress , however they all depend on the user's contact with the text box.

I follow my progress below with my doubt, when I press the "Validate" button it is externally assigned "123" to a text box and my function does not identify the variation of the text box and does not execute the function, it executes only when the user interacts with it.

<form action="" name="f1">  
  <label>Comparar valores <BR>(Valores iguais = PRETO, Valores diferentes=VERMELHO)</label> <br>
  <input type="text" id="pass" oninput="Verifica()"/>
<input type="text" id="pass2"  oninput="Verifica()"/>
<script>
function Verifica(){
    val1=document.getElementById("pass").value;
    val2=document.getElementById("pass2").value;
    if(val1!=val2){
    document.getElementById("pass").style.borderColor="#f00";
        document.getElementById("pass2").style.borderColor="#f00";
    }
    else{document.getElementById("pass").style.borderColor="#000";
        document.getElementById("pass2").style.borderColor="#000";

        }
    }
</script>
<input type="button" value="Validar" onClick="validarSenha()">

<script>
function validarSenha(){
	document.getElementById("pass2").value = "123"
}
</script>
    
asked by anonymous 23.06.2016 / 07:06

1 answer

0

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>       
        <form action="" name="f1">  
            <label>Comparar valores <BR>(Valores iguais = PRETO, Valores diferentes=VERMELHO)</label> <br>
            <input type="text" id="pass" oninput="Verifica()"/>
            <input type="text" id="pass2"  oninput="Verifica()"/>
            <script>
                function Verifica(){
                    val1=document.getElementById("pass").value;
                    val2=document.getElementById("pass2").value;
                    if(val1 != val2){
                        document.getElementById("pass").style.borderColor="#f00";
                        document.getElementById("pass2").style.borderColor="#f00";
                    }else{
                        document.getElementById("pass").style.borderColor="#000";
                        document.getElementById("pass2").style.borderColor="#000";
                    }
                };
            </script>
            <input type="button" value="Validar" onClick="validarSenha()"/>

            <script>
                function validarSenha(){
                    senha1 = document.getElementById("pass").value;
                    senha2 = document.getElementById("pass2").value;
                    document.getElementById("pass2").value = "123";
                    if (senha2  != document.getElementById("pass2").value){
                        if (senha1 == senha2)
                            alert("SENHAS IGUAIS");
                    else
                        alert("SENHAS DIFERENTES");
                    }
                }
            </script>
        </form>
    </body>
</html>
    
23.06.2016 / 13:37