使用javascript自定义Contenteditable行为

前端之家收集整理的这篇文章主要介绍了使用javascript自定义Contenteditable行为前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
目前在Firefox下,当我在一个令人满意的段落中按回车时,它插入一个br标签创建一个新的段落标签,然后将一个br标签放在该新段落中.我想修改这样的行为

> Shift enter = br tag(这已经是默认值)

>输入重复的当前元素是p,li,h1..etc并删除任何尾随或前导(W3C规范需要一些我可以使用的事件,但我完全不确定如何实现它们.
>元素开头的退格键会将它与前面的兄弟元素合并(如果存在)
>元素末尾的删除会将其与以下兄弟(如果存在)合并.

我试过捕获按键并检查返回,删除和退格键,但我似乎无法准确获取当前的插入位置或者如果我覆盖它则阻止默认行为.

如果有人在那里知道如何…我会发现它最有帮助

>在一个令人满意的段落中获取和/或设置当前插入位置.
>防止contenteditable的默认行为
>附上W3C建议所要求的活动. http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-mutationevents

也许有人甚至知道已经以这种方式行事的用户代理(浏览器).这是可以接受的.

谢谢,

丹尼尔

解决方法

要编辑内容可编辑的行为,我会这样做:
$("#editable").bind("keypress",function(e){
   if(e.keyCode==13 && e.shiftKey){ //enter && shift
      e.preventDefault(); //Prevent default browser behavior
      this.html(this.html+"<br>");
   }
});

你可以编辑html函数里面的内容. PS:我不记得jQuery是否在事件对象上有shiftKey和keyCode …如果出现任何问题,请将e更改为e.originalEvent.

得到carret的位置:
在非IE中:

document.getSelection().anchorOffset

猜你在找的JavaScript相关文章