Как я могу размыть div, где contentEditable = true?

Как я могу размыть/сфокусировать div, где contentEditable = true? Я попытался $(elm).blur() и $(elm).attr('contentEditable', false);

Ответ 1

$("div[contentEditable]").blur(), чтобы размыть все элементы contentEditable.

$("#elementId").blur(), чтобы размыть элемент его id.

Ответ 2

Я бы добавил другое решение, основанное на ответе Omnicon, который является правильным BTW. Я разветкил его скрипку и обновил ее.

Хитрость заключается в том, чтобы удалить все диапазоны после вызова размытия:

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

Ответ 3

Предлагаемое решение Roman Resh не работает, когда вы нажимаете на элемент и сразу же вводите его. Он не будет размываться, но создает линии-перерывы/divs.

Можно полностью предотвратить это поведение.

См. эту скрипту

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

Ответ 4

Добавляя все ответы, при использовании чего-то вроде

$(".editable").blur()

думайте о размытии только сфокусированного, например

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

Если вы не можете иногда встречаться с хорошими проблемами