Olá,
O código abaixo verifica se o que foi digitado no input é maior ou igual a 10 e menor igual o valor disponível : 100.51. Se for verdadeiro o botão precisa ficar todo preto. O problema é que quando você digita R$90,00 por exemplo, a validação acaba sendo burlada. Mas se você der um ctrl + c e colar no input a validação é aplicada.
Existe alguma forma de sempre que algo for digitado dar um "Refresh" em javascript?
function maskIt(w,e,m,r,a){
// Cancela se o evento for Backspace
if (!e) var e = window.event
if (e.keyCode) code = e.keyCode;
else if (e.which) code = e.which;
// Variáveis da função
var txt = (!r) ? w.value.replace(/[^\d]+/gi,'') : w.value.replace(/[^\d]+/gi,'').reverse();
var mask = (!r) ? m : m.reverse();
var pos = (a ) ? a.pos : "";
var ret = "";
if(code == 9 || code == 8 || txt.length == mask.replace(/[^#]+/g,'').length) return false;
// Loop na máscara para aplicar os caracteres
for(var x=0,y=0, z=mask.length;x<z && y<txt.length;){
if(mask.charAt(x)!='#'){
ret += mask.charAt(x); x++;
} else{
ret += txt.charAt(y); y++; x++;
}
}
// Retorno da função
ret = (!r) ? ret : ret.reverse()
if (w.value.match("-")){
w.value = "-"+ret+pos;
}else{
w.value = ret+pos;
}
}
// Novo método para o objeto 'String'
String.prototype.reverse = function(){
return this.split('').reverse().join('');
};
//desabilita o botão no início
document.getElementById("botao").disabled = true;
//cria um event listener que escuta mudanças no input
document.getElementById("valordigitado").addEventListener("input", function(event){
//busca conteúdo do input
var valordispo = 100.51;
var valorsolicitado = document.getElementById("valordigitado").value;
var valorsolicitado = valorsolicitado.replace(",", ".");
let valorsoli = Number(valorsolicitado);
if (valorsoli >= 10 && valorsoli <= valordispo) { // O valor esta OK!
//include "m3.html";
// document.write(valorsoli);
document.getElementById("botao").disabled = false;
} else {
document.getElementById("botao").disabled = true;
}
});
<html>
<head>
<title></title>
</head>
<body>
<style type="text/css">
.button{background-color: black}
</style>
<input type="text" name="dinheiro" id="valordigitado" onkeyup="maskIt(this,event,'###.###.###,##',true,{pos:''})" class="line-animation" maxlength="7" step="0.01" autocomplete="off">
<button class="button" id="botao">Enviar</button>
</body>
</html>
keyup