¿Cómo puedo desenfocar un div donde contentEditable = true?

Question

¿Cómo puedo desenfocar/enfocar un div donde contentEditable = true? He intentado $(elm).blur() y $(elm).attr('contentEditable', false);

Answer 1

$("div[contentEditable]").blur() para desenfocar todos los elementos de contenido editable.

$("#elementId").blur() para desenfocar un elemento por su id.

Answer 2

La solución sugerida por Roman Resh no funciona cuando hace clic en el elemento y presiona enter inmediatamente después. No se desdibujará, sino que creará saltos de línea/divs.

Es posible evitar este comportamiento por completo.

See this fiddle

$('<div class="temp-contenteditable-el" contenteditable="true"></div>') .appendTo('body').focus().remove();

Answer 3

me gustaría añadir otra solución que se basa en la respuesta de Omnicon que es correcta por cierto. Tengo forked his fiddle and updated it.

El truco es eliminar todos los rangos después de llamar a la falta de definición:

$(".editable").blur(); 
window.getSelection().removeAllRanges(); 

Answer 4

Al añadir a todas las respuestas, cuando se usa algo como

$(".editable").blur() 

pensar borrando sólo se centra, como

$(".editable:focus").blur() 

Si no puede entrar en buenos problemas a veces