soy completamente nuevo en jquery y no entiendo cómo completar mi código
Tengo 2 números de tipo de entrada con id=TA1 e id=TA2. tengo una opción de selección para elegir entre "+", "-", "/" y "*" y esto es id=op. Ahora, en mi función jquery, ¿qué debo escribir para que funcione? sé que en js hay eval() pero no sé cómo hacerlo en jquery...
var Calcolatrice = function (args) { this.args = args; }; Calcolatrice.prototype.calc = function (x, y, z) { var x = $("#TA1").val(value); var y = $("#TA2").val(value); var z = $("#op").val(value); }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } .black { background-color: black; }
<body class="black"> <div class="flex flex-row justify-evenly py-32"> <div class="flex flex-col"> <input type="number" id="TA1"> </div> <div class="flex flex-col"> <select id="op"> <option label="+">+</option> <option label="-">-</option> <option label="/">/</option> <option label="*">*</option> </select> </div> <div class="flex flex-col"> <input type="number" id="TA2"> </div> </div> <div class="flex flex-row justify-center"> <div class="flex fllex-col"> <textarea name="risultato" id="risultato" cols="30" rows="1"> </textarea> </div> </div> </body>
este fragmento no representa el resultado final ya que usé tailwind y flexbox pero no los puse en el código del fragmento
Puedes hacerlo así
$("input").on('input',() => { var x = $("#TA1").val(); var y = $("#TA2").val(); var z = $("#op").val(); if(x && y && z){ $("#risultato").val(eval(`${x}${z}${y}`)); } });
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } .black { background-color: black; }
<div class="flex flex-row justify-evenly py-32"> <div class="flex flex-col"> <input type="number" id="TA1"> </div> <div class="flex flex-col"> <select id="op"> <option label="+">+</option> <option label="-">-</option> <option label="/">/</option> <option label="*">*</option> </select> </div> <div class="flex flex-col"> <input type="number" id="TA2"> </div> </div> <div class="flex flex-row justify-center"> <div class="flex fllex-col"> <textarea name="risultato" id="risultato" cols="30" rows="1"> </textarea> </div> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>