event change javascript jquery event-handling

javascript - select option jquery change event



jQuery, change-event SÓLO cuando el usuario mismo cambia una entrada (3)

podemos detectar si un usuario cambia algo:

$(''#item'').change(function() { alert(''changed!''); });

lamentablemente, a veces necesito llamarlo artiffically: $(''#item'').change() pero en este caso también se toma como "cambiado". ¿Hay alguna forma de distinguir la actividad del usuario de la actividad manual?


El parámetro de evento de la devolución de llamada contendrá una clave originalEvent cuando el usuario desencadene el evento, por lo que puede hacer:

$(''#item'').change(function(e){ if (e.originalEvent){ alert(''Changed by user''); } // Place common code here });


El primer argumento devuelto por un controlador de eventos jQuery es el objeto de evento:

$(''#item'').change(function(e) { console.log(e); // The event object });

La forma en que generalmente diferencio entre un evento desencadenado por un usuario y un evento desencadenado por un código es que los eventos activados por el usuario tienen una propiedad originalEvent asociada a ellos. No sé si este es el mejor enfoque, pero lo haría así:

$(''#item'').change(function(e) { if (e.originalEvent) { // user-triggered event } else { // code-triggered event } });

Ejemplo

Escriba el elemento de input en el siguiente ejemplo, luego desenfoque el elemento. Recibirá una alerta que diga "user-triggered" . Haga clic en el botón para invocar un cambio provocado por el código. Recibirá una alerta que dice "code-triggered" .

$(''#item'').change(function(e) { if (e.originalEvent) { alert(''user-triggered'') } else { alert(''code-triggered'') } }); $(''button'').on(''click'', function() { $(''#item'').change(); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type=text id=item /> <button>Click here to trigger change</button>


Un enfoque diferente de originalEvent debería ser el uso de parámetros de evento:

$(''#item'').change(function(event,who) { if(who === "machine") alert(''machine!''); else alert(''human!''); }); $( "#item").trigger( "change", [ "machine"] );