tinyMCE将光标移出双倍空间上的标记

Question

已解决！

我将SPAN标签添加到tinyMCE可视化编辑器中以显示突出显示的文本。

在高亮显示的跨度内键入内容时，可能会出现光标陷入......的情况，无法键入跨度的一侧。

我创建了一些JavaScript，关于“双空间”

下面的代码火灾...

1）检查当前光标位置是我强调SPAN

2中。 ）检查当前光标位置是否在该SPAN的末尾（就在关闭/ SPAN之前）

3.）将当前光标从关闭/ SPAN的左侧移动到关闭/ SPAN的右侧

任何或所有的帮助将不胜感激。

正确的代码！

在打字时，如果你发现自己在一个SPAN元素的结束自我，按下空格键两次，以打破目前的SPAN

var mycc = '' 
ed.onKeyDown.add(function(ed, e){ 
    evt = e || window.event; 
    var charCode = evt.keyCode || evt.which; 
    // if dbl space 
    if(mycc == charCode && charCode==32){ 
     var curElm = ed.selection.getRng().startContainer; 
     var caretPos = ed.selection.getBookmark(curElm.textContent).rng.startOffset; 
     // if end of element 
     if(caretPos==curElm.textContent.length){ 
      var mkr = '<span class="marker">!</span>' 
      // add marker for cursor positioning 
      ed.selection.setContent(mkr) 
      var newstr = '' 
      // split content at marker (plus ending span for my case) 
      var c = ed.getContent({format : 'raw'}).split(" "+mkr+"</span>") 
      if(!c[1]){ 
       c = ed.getContent({format : 'raw'}).split(" "+mkr+"<br></span>") 
      } 
      // if the conent was split, adjust as needed 
      if(c[0]&&c[1]){ 
       // add closing span back plus marker after 
       newstr = c[0]+'</span>'+mkr+c[1] 
       // update content 
       ed.setContent(newstr) 
      } 
      // find the marker 
      var marker = jQuery(ed.getBody()).find('.marker'); 
      // set selection 
      ed.selection.select(marker.get(0)); 
      // remove marker 
      marker.remove(); 
     } 
    } 
    mycc = charCode 
}) 
ed.onMouseDown.add(function(ed, e){ 
    mycc = '' 
}) 

上面仍然有效的，但我去下面的代码。这个代码爆发跨度的结束位置的按压右时，而不是AROW的DBL空间

享受

var mycc = '' 
ed.onKeyDown.add(function(ed, e){ 
    evt = e || window.event; 
    var charCode = evt.keyCode || evt.which; 
    // if dbl space 
    //if(mycc == charCode && charCode==32){ 
    if(charCode==39){ 

     var curElm = ed.selection.getRng().startContainer; 
     var caretPos = ed.selection.getBookmark(curElm.textContent).rng.startOffset; 
     // if end of element 
     if(caretPos==curElm.textContent.length){ 
      var mkr = '<span class="marker">!</span>' 
      ed.selection.setContent(mkr) 
      var newstr = '' 
      var c = ed.getContent({format : 'raw'}).split(mkr+"</span>") 
      if(!c[1]){ 
       c = ed.getContent({format : 'raw'}).split(mkr+"<br></span>") 
      } 
      if(c[0]&&c[1]){ 
       newstr = c[0].replace(/^\s\s*/, '').replace(/\s\s*$/, '')+'</span>&nbsp;'+mkr+c[1].replace(/^\s\s*/, '').replace(/\s\s*$/, '').replace(/^[\s(&nbsp;]+/g,'') 
       ed.setContent(newstr) 
       e.preventDefault() 
      } 
      var marker = jQuery(ed.getBody()).find('.marker'); 
      ed.selection.select(marker.get(0)); 
      marker.remove(); 
     } 
    } 
    mycc = charCode 
}) 

Answer 1

我更新了我的问题的Wi正确的代码。

Answer 2

1）看看当前光标位置是我强调SPAN

内

这是可能的

var ed = tinymce.get('your_editor_id') 
var node = ed.getSelection.getNode(); // in case of complex nestings you will need to loop along the parentNode till you find a span-node 

if ($(node).hasClass('highlight')) {...whatever you like..}