Supongamos que tengo un campo de entrada delegado con el nombre de clase ' bulk_number ' dentro de un nombre de clase principal ' all_bulk_inputs ', y un botón que agregará un número aleatorio a ese campo de entrada cada vez que haga clic en él. Ahora quiero activar un detector de eventos de cambio cada vez que cambie el número.
Por ejemplo:
<!-- input field under all_bulk_inputs --> <div class="all_bulk_inputs"> <input class="bulk_number" name="rand_number" /> <!-- dynamically added under the 'all_bulk_inputs' parent --> </div> <button id="add_rand">Add Random Number</button> <script> $('#add_rand').on('click', function(){ $('.bulk_number').val(10) //suppose, 10 is my random number //what I want is forcefully trigger on change like bellow, if possible $('.all_bulk_inputs').trigger('change', 'bulk_number', function(){ console.log('bulk number changed) }) }) </script>En primer lugar, tiene un error en el registro de línea. Hay algunas formas de hacer esto, pero esta es la más simple. He explicado qué significa el código con comentarios.
console.log('número masivo cambiado)
entonces es posible que desee verificar el documento de cambio Cambiar
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> </head> <body> <div class="all_bulk_inputs"> <input class="bulk_number" name="rand_number" /> <!-- dynamically added under the 'all_bulk_inputs' parent --> </div> <button id="add_rand">Add Random Number</button> <script> $(document).ready(function() { //When random number setted to the input under all_bulk_inputs div below will triggered $('.all_bulk_inputs .bulk_number').on('change', function() { console.log(`bulk number changed and the value is ${$(this).val()}`) }) $('#add_rand').on('click', function() { // create between 0 and 100 number and set to input const rnd = Math.floor(Math.random() * 100) $('.bulk_number').val(rnd).change() }) }); </script> </body> </html>