javascript - select option jquery change event

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

Question

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?

Answer 1

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 });

Answer 2

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>

Answer 3

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"] );