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