Question

我创建了一个有意义的div。我想在其中一个孩子中锁定文本编辑（在下面的例子中，我想锁定“是”）。这是HTML：

<div id="foo" contenteditable="true">this is a test
    <div contenteditable="false"> 
        <ul>
            <li>
                <a id="test" contenteditable="true" href="stackoverflow.com">a link here</a>
            </li>
        </ul>
    yes
    </div>
    ...    
</div>

和JavaScript代码：

document.getElementById('foo').addEventListener("keypress", function(e){
    alert("div " + e.which);
});

document.getElementById('test').addEventListener("keypress", function(e){
    alert("a " + e.which);
});

演示链接：http://jsfiddle.net/wCs8J/1/

问题是，当您单击<li>的右侧（当光标是默认箭头时），您将能够编辑<a>中的文本。但是，<a>没有收到“按键”，只有主div收到它。为什么？我该怎么做才能让它发挥作用？

Answer 1

从#foo关闭ContentEditable继续播放来自#test的事件

http://jsfiddle.net/Maslow/wCs8J/2/

也许这是浏览器特定的问题？

<li>中的元素有时候不会收到按键事件</li>

1 个答案: