Saltar al contenido

Ingrese jQuery obtenga el valor anterior antes del cambio y obtenga el valor después del cambio

Recabamos por todo el mundo on line para traerte la respuesta para tu inquietud, si continúas con inquietudes puedes dejar la duda y contestaremos con gusto, porque estamos para ayudarte.

Solución:

La forma más sencilla es guardar el valor original usando data() cuando el elemento recibe el foco. Aquí hay un ejemplo realmente básico:

JSFiddle: http://jsfiddle.net/TrueBlueAussie/e4ovx435/

$('input').on('focusin', function()
    console.log("Saving value " + $(this).val());
    $(this).data('val', $(this).val());
);

$('input').on('change', function()
    var prev = $(this).data('val');
    var current = $(this).val();
    console.log("Prev value " + prev);
    console.log("New value " + current);
);

Es mejor usar controladores de eventos delegados

Nota: por lo general, es más eficaz utilizar un controlador de eventos delegado cuando puede haber varios elementos coincidentes. De esta manera, solo se agrega un solo controlador (menor sobrecarga e inicialización más rápida) y cualquier diferencia de velocidad a la hora del evento es despreciable.

Aquí está el mismo ejemplo usando eventos delegados conectados a document:

$(document).on('focusin', 'input', function()
    console.log("Saving value " + $(this).val());
    $(this).data('val', $(this).val());
).on('change','input', function()
    var prev = $(this).data('val');
    var current = $(this).val();
    console.log("Prev value " + prev);
    console.log("New value " + current);
);

JsFiddle: http://jsfiddle.net/TrueBlueAussie/e4ovx435/65/

Los eventos delegados funcionan escuchando un evento (focusin, change etc) en un elemento antepasado (document* en este caso), luego aplicando el filtro jQuery (input) solo a los elementos en la cadena de burbujas luego aplicando la función solo a aquellos elementos coincidentes que causaron el evento.

*Nota: Como regla general, utilice document como predeterminado para los eventos delegados y no body. body tiene un error, relacionado con el estilo, que puede hacer que no obtenga eventos de mouse con burbujas. también document siempre existe para que pueda adjuntarlo fuera de un Manejador listo para DOM 🙂

Definitivamente, deberá almacenar el valor anterior manualmente, según el momento que le interese (antes de enfocar, desde el último cambio). El valor inicial se puede tomar de la propiedad defaultValue:

function onChange() 
    var oldValue = this.defaultValue;
    var newValue = this.value;

El valor antes de enfocar se puede tomar como se muestra en la respuesta de Gone Coding. Pero hay que tener en cuenta que el valor se puede cambiar sin enfocar.

He encontrado una solución que funciona incluso con el complemento “Select2”:

function functionName() 
  $('html').on('change', 'select.some-class', function() 
    var newValue = $(this).val();
    var oldValue = $(this).attr('data-val');
    if ( $.isNumeric(oldValue) )  // or another condition
      // do something
    
    $(this).attr('data-val', newValue);
  );
  $('select.some-class').trigger('change');

Aquí puedes ver las comentarios y valoraciones de los lectores

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *