小编vkd*_*vkd的帖子

contenteditable div中的子元素的键盘事件?

我有一个div,谁的contenteditable属性已设置为true.我如何让孩子们回应键盘事件?似乎唯一的方法是捕获父div中的事件并通过选择apis找出孩子.有没有更好的办法?更具体地说,我可以将键盘事件处理程序附加到子元素吗?我错过了什么吗?

附件是说明问题的示例代码.希望代码内的注释充分解释.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY>
<div id="editable" contentEditable='true' style='height: 130px; width: 400px; border-style:solid; border-width:1px'>
    <span id="span1" onkeypress="alert('span1 keypress')">test text 1</span> <!-- does not work -->
    <span id="span2" > test text2</span>
    <span id="span3" onclick="alert('span3 clicked')">test text 3</span>  <!-- this works fine -->
</div>
<!-- Uncomment this to set a keypress handler for span2 programatically. still doesnt work -->
<!--
<script type="text/javascript">
    var span2 = document.getElementById('span2');
    span2.onkeypress=function() {alert('keypressed on ='+this.id)};
</script>
-->

<!-- Uncomment this to enable keyboard events for …
Run Code Online (Sandbox Code Playgroud)

contenteditable keyboard-events

5
推荐指数
1
解决办法
2659
查看次数

标签 统计

contenteditable ×1

keyboard-events ×1