在输入</li>时,从'contenteditable <li>元素中抓住'输入'按钮

时间:2013-08-17 12:56:55

标签: jquery

我有以下HTML代码:

<li class="option-item new" contenteditable="true">simple element2</li>

在编辑此元素时单击ENTER键,我想退出编辑模式(将contentEditable设置为false),而不是键入换行符。所以我附上了以下事件列表:

$("#ctx-options").on('keypress', '.option-item.new', catch_enter);

问题是虽然它是针对所有其他键触发的,但是没有为ENTER键触发事件。我不明白为什么。我使用的方法与here相同,但它对我不起作用。

2 个答案:

答案 0 :(得分:6)

您需要绑定到keydown,因为当keypress触发时,事件已经发生:

$("#ctx-options").on('keydown', '.option-item.new', function(e) {  
    if(e.keyCode == 13)
    {
        e.preventDefault();
    }
});

请参阅jsFiddle demo

答案 1 :(得分:3)

我今天已经回答了类似的问题here。您必须使用keydown事件。 keypress仅适用于有限的键子集(返回键似乎对我有用,但箭头键不起作用;据我所知,keypress只能对字母数字字符可靠地工作。)