Как удалить HTML из редактируемого содержимого div, если он находится под курсором?

Я пытаюсь удалить класс .words из этого HTML всякий раз, когда он щелкает по нему или если над ним происходит нажатие клавиши.

<div id="content" contenteditable="true"> Here are <span class="words" id="whatever">some</span> words </div>

я пробовал

$('.words').click(function() { $(this).remove(); });

и другое, которые работают, за исключением случаев, когда я нажимаю на другое слово и перебираю .words с помощью левой или правой клавиши (поскольку он доступно для редактирования). Я бы хотел, чтобы его удалили, как только курсор окажется над классом. Спасибо.


person Squirrl    schedule 13.02.2014    source источник
comment
Думаю, на этот вопрос уже был дан ответ? stackoverflow.com/questions/1197401/   -  person Nick Grealy    schedule 14.02.2014


Ответы (1)


Что-то вроде этого?

var words = $('.words')[0]    

$('#content').keyup(function(){    
    if (words == getSelectionStart()){
        $(words).remove()   
    }
})

function getSelectionStart() {
   var node = document.getSelection().anchorNode;
   return (node.nodeType == 3 ? node.parentNode : node);
}

Пример: http://jsfiddle.net/nickg1/ttMJW/1/ < / а>

person Nick Grealy    schedule 13.02.2014