Necesito ayuda con esto.
Tengo 3 entradas, una type=range y las otras dos type=text .
He conseguido que las tres entradas estén relacionadas. Es decir, si cambio una entrada, las otras entradas también cambian. En esta parte, el código funciona bien.
Mi problema es que quiero devolver una variable que sea igual a 0 o 1 dependiendo del elemento cambiado.
Permítanme explicar, si el usuario mueve el cursor del rango de tipo, o escribe en la primera entrada, elmChanged devuelve 1. Pero, en el otro caso, si el usuario escribe en la segunda entrada, elmChanged devuelve 0
Intenté usar onchange y onkeyup , pero no pude encontrar una solución porque, si cambio el valor de una entrada, las otras dos entradas también cambian. Intenté usar también onkeyup , pero tampoco pude encontrar una solución porque no pude administrar cómo cambiar el valor de elmChanged .
Mi pregunta es cómo puedo hacer esto y dónde cargar elmChanged dependiendo del último elemento cambiado.
var elmChanged = "" function RangeChanged(){ amountInput.value=amountRange.value; amountInput_2.value=amountRange.value * 2 // how can i do that elmChanged = 1 } function FirstInputChanged(){ amountRange.value=amountInput.value; amountInput_2.value=amountInput.value * 2; // how can i do that elmChanged = 1 } function SecondInputChanged(){ amountRange.value=amountInput_2.value; amountInput.value=amountInput_2.value / 2; // how can i do that elmChanged = 0 } console.log(elmChanged) ElementInputChanged.value = elmChanged <form> <input type="range" name="amountRange" id="amountRange" min="0" max="100" value="50" step="1" oninput="RangeChanged()" /> <input type="text" name="amountInput" id="amountInput" min="0" max="100" value="50" oninput="FirstInputChanged()" /> <input type="text" name="amountInput_2" id="amountInput_2" min="0" max="200" value="100" oninput="SecondInputChanged()" /> <span>Element Changed:</span> <span id="ElementInputChanged"></span> </form>Puedes pasarlo a una función. Por cierto: el span no tiene value como las entradas. Lo cambié a textContent .
Retazo:
/*var elmChanged = ""*/ function RangeChanged(){ amountInput.value=amountRange.value; amountInput_2.value=amountRange.value * 2 // how can i do that elmChanged(1); } function FirstInputChanged(){ amountRange.value=amountInput.value; amountInput_2.value=amountInput.value * 2; // how can i do that elmChanged(1); } function SecondInputChanged(){ amountRange.value=amountInput_2.value; amountInput.value=amountInput_2.value / 2; // how can i do that elmChanged(0); } function elmChanged(num) { console.log(num) ElementInputChanged.textContent = num } <form> <input type="range" name="amountRange" id="amountRange" min="0" max="100" value="50" step="1" oninput="RangeChanged()" /> <input type="text" name="amountInput" id="amountInput" min="0" max="100" value="50" oninput="FirstInputChanged()" /> <input type="text" name="amountInput_2" id="amountInput_2" min="0" max="200" value="100" oninput="SecondInputChanged()" /> <span>Element Changed:</span> <span id="ElementInputChanged"></span> </form>