Как узнать, остается ли img-тег от узла каретки в редакторе html?

Question

Я использую редактор html для редактирования контента. Теперь мне нужно убедиться, что очень специальный элемент не удаляется (изображения со специальным классом).

Для случаев использования не сложенного выбора/диапазона с помощью BACKSPACE, DELETE, CTRL + X/CMD + X я нашел решение, но я все еще ищу решение для случая, когда выбор/диапазон не сбрасывается, а следующее Backspace удаляет одно из моих специальных изображений.

Как я могу определить, удалит ли следующий Backspace/Delete один из этих тегов img?

Пример: CARET отмечает положение курсора/курсора. Если Backspace будет нажата, изображение будет удалено. Как я могу обнаружить этот случай?

<p>Some Text <b>here <img class="my class" src="..."/></b>CARET some text</p> 

Answer 1

ниже код определяет элементы вокруг каре с onkeyup (и onselectionchange), но это только для IE. Может быть, он может быть «переведен» на jQuery.

function detectClass(){ 
    var range, parentR, parentL; 
    range = document.selection.createRange(); 
    range.moveStart('character',1); 
    range.moveEnd('character',1); 
    parentR = range.parentElement(); 
    range.moveStart('character',-2); 
    range.moveEnd('character',-2); 
    parentL = range.parentElement(); 
    if (parentR.className == 'special'){/* special on right */} 
    if (parentL.className == 'special'){/* special on left */} 
    return; 
} 

Answer 2

Для случая проверки, является ли рядом с изображением каретка, вот мой ответ на подобный вопрос. Он полагается на поддержку Rangy for IE < 9, но может быть тривиально сделан, чтобы не полагаться на Rangy.

Ответ только учитывает обратное пространство, но может быть легко адаптирован для работы для . Удалить.

https://stackoverflow.com/a/10020476/96100