¿Marcar para ContentEditable?

Extraño... hay muchas preguntas sobre esto. attr aquí en StackOverflow, pero ninguno respondió a mi siguiente pregunta:

Tengo un span (solo por ejemplo), en los que se han habilitado ContentEditable. Solo quiero guardar los elementos modificados (a través de jQuery y ajax).

El problema:

¿Cómo puedo asegurar si un elemento ha cambiado?

newVAl==oldVal no es una opción: no quiero guardar el valor anterior para comparar.

¿Hay alguna bandera (o algún otro indicador) que diga: "isChanged"?

preguntado el 01 de junio de 12 a las 12:06

"No quiero guardar el valor antiguo para comparar"... bueno, creo que tendrás que hacerlo. ¿Por qué no puedes hacer eso? -

@JamesAllardice, la misma razón por la que una fila en la tabla de datos en C# tiene un estado (marcas modificadas o eliminadas)

Esa no es una razón por la que no quiera guardar los datos del span -

No, no existe tal bandera. Lo único que podrías hacer es levantar uno en el keyup evento, pero eso no garantiza que una edición posterior no deshará los cambios realizados. La razón que mencionas no es una razón, solo una reiteración de lo que deseas. -

@d_inevitable, ¿realmente cree que debería guardar el texto largo (en muchas áreas de la página), solo para equipararlo con el nuevo texto? es un enfoque muy malo ... (en programación de todos modos) -

2 Respuestas

Intente usar atributos de datos html5 como los siguientes:

$('element').change(function() {
    $(this).attr('data-edited', true);
});

De demostración

Respondido el 01 de junio de 12 a las 13:06

Es fácil obtener un falso positivo con este, cuando el usuario edita el campo y luego deshace todos sus cambios. Sin embargo, si no desea comparar con la cadena original, esta es la única forma de hacerlo, ya que las funciones hash no están disponibles en JS Core. En la mayoría de los casos, este falso positivo no debería suponer un gran problema. Cuando edita cualquier documento y luego deshace los cambios, el editor generalmente también lo marcará como "no guardado". Así que esta es una práctica estándar. +1 - d_inevitable

@d_inevitable Por supuesto, debe trabajar un poco en este código, pero esta es la idea básica. - Ricardo Álvaro Lohmann

@RicardoLohmann hay algo especial con específico data-edited nombre que elegiste? a veces veo esto data-XXX en el elemento html(5). pero ¿hubo alguna razón especial por la que eligió este nombre específico? - Royi Namir

@RoyiNamir No, puedes elegir el nombre que quieras después data-. - Ricardo Álvaro Lohmann

@RicardoLohmann pero es el data- el prefijo es obligatorio? ¿Cómo puedo usar estos atributos más adelante? solo por xx.dataset? - Royi Namir 

$('[contenteditable]').focus(function(){
      $(this).attr("data-old",$(this).html());
}).blur(function(){
   if( $(this).html() != $(this).attr("data-old") ){
       changed, save ... 
   }
});

Actualizar:

Demostración en jsfiddle

Respondido el 20 de junio de 20 a las 10:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.