防止 contenteditable 添加 <div>在 ENTER 上 - Chrome [英] Prevent contenteditable adding <div> on ENTER - Chrome

问题描述

我有一个 contenteditable 元素，每当我输入一些东西并按 ENTER 时，它都会创建一个新的

并放置那里的新行文本.我有点不喜欢这个.

是否有可能防止这种情况发生，或者至少将其替换为 <br>?

这里是演示 http://jsfiddle.net/jDvau/

注意:这在 Firefox 中不是问题.

解决方案

试试这个:

$('div[contenteditable]').keydown(function(e) {//捕获被按下的返回键if (e.keyCode === 13) {//插入 2 个 br 标签(如果只插入一个 br 标签，则光标不会跳到下一行)document.execCommand('insertHTML', false, '<br/>');//防止按下返回键的默认行为返回假；}});

点击此处查看演示

I have a contenteditable element, and whenever I type some stuff and hit ENTER it creates a new <div> and places the new line text in there. I don't like this one little bit.

Is it possible to prevent this from happening or at least just replace it with a <br>?

Here is demo http://jsfiddle.net/jDvau/

Note: This is not an issue in firefox.

解决方案

Try this:

$('div[contenteditable]').keydown(function(e) {
    // trap the return key being pressed
    if (e.keyCode === 13) {
        // insert 2 br tags (if only one br tag is inserted the cursor won't go to the next line)
        document.execCommand('insertHTML', false, '<br/>');
        // prevent the default behaviour of return key pressed
        return false;
    }
});

Click here for demo

这篇关于防止 contenteditable 添加 <div>在 ENTER 上 - Chrome的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！