获取光标在TinyMCE中的光标位置或行数

如何获取TinyMCE中的光标位置或光标在TinyMCE中的行数?

以下是我用于获取实际行号的自己的插件中的函数的一部分:

var ed = tinymce.get('my_editor_id'); var bm = ed.selection.getBookmark(); var $marker = $(ed.getBody()).find('#'+bm.id); var elem = ed.getDoc().getElementById(bm.id+'_start'); try { box = elem.getBoundingClientRect(); } catch(e) { // should not happen console.log('error creating box: ' + e); } var doc = ed.getDoc(), docElem = doc.documentElement, body = ed.getBody(), win = ed.getWin(), clientTop = docElem.clientTop || body.clientTop || 0, clientLeft = docElem.clientLeft || body.clientLeft || 0, scrollTop = win.pageYOffset || jQuery.support.boxModel && docElem.scrollTop || body.scrollTop, scrollLeft = win.pageXOffset || jQuery.support.boxModel && docElem.scrollLeft || body.scrollLeft, top = box.top + scrollTop - clientTop, left = box.left + scrollLeft - clientLeft; // set Bookmark ed.selection.moveToBookmark(bm); var caret_line = Math.floor( (top) / lineHeight ) + 1; 

函数getBoundingClientRect()用于创建一个框,我们可以从中获取多个定位信息。 请注意,我们需要使用marker元素并稍后重置插入符号。

更新: lineHeight的信息

  // get height of row: eighter line-height or min-height if ( $(ed.getBody()).find('p:first').css('line-height') != 'normal'){ lineHeight = $(ed.getBody()).find('p:first').css('line-height') ; } else { lineHeight = $(ed.getBody()).find('p:first').css('min-height'); } var lineHeight = lineHeight.substr(0, lineHeight.length -2 );