Добавьте функцию keyDown () к <a>, которая является новым потомком contenteditable div

Question

Jsfiddle: http://jsfiddle.net/qTEmc/1/

Мне нужно связать события с событием нажатия клавиш по ссылкам, которые добавляются в contenteditable.

Если вы попытаетесь набрать в contenteditable области в связанном jfiddle, вы увидите, что он создает ссылку, и вы можете печатать внутри нее. Я нажимаю клавишу возврата, вы переходите на новую строку. Я хочу нажать клавишу возврата в новой ссылке, чтобы вызвать функцию. Ради прогресса я просто пытаюсь заставить его вернуть оповещение в данный момент.

Кто-нибудь знает надежный способ сделать это?

Answer 1

Вы не сможете обнаружить ключевые события внутри самих ссылок, потому что они не запускают ключевые события. Вместо этого вам нужно адаптировать существующий обработчик keypress для элемента contenteditable, чтобы проверить выбор, чтобы увидеть, находится ли он внутри ссылки. Вот функция для этого. Я также обновил вашу демо .

function selectionInsideLink() {
    var node = null, sel;

    // Get the selection container node
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.rangeCount) {
            node = sel.getRangeAt(0).commonAncestorContainer;
        }
    } else if (document.selection) {
        sel = document.selection;
        if (sel.type != "Control") {
            node = sel.createRange().parentElement();
        }
    }

    // Check if the node is or is contained inside a link
    while (node) {
        if (node.nodeType == 1 && node.tagName.toLowerCase() == "a") {
            return true;
        }
        node = node.parentNode;
    }
    return false;
}