Javascript 如何知道Ckeditor锚是否封装在跨度内?

Javascript 如何知道Ckeditor锚是否封装在跨度内?,javascript,ckeditor,Javascript,Ckeditor,这是专门为CKEditor的开发人员准备的 目标是了解光标何时位于自定义属性范围的内部或外部 使用Ckeditor时,如果从插件中插入下面这样的自定义跨距,有时在您停止键入时,取消文本区域的焦点,并将cusor替换到行尾,就像您在继续键入之前停止的内容一样。文本可以在范围内,也可以在没有封装的范围外 取消焦点之前的示例: <span style="color:blue;line-height:12px;font-size:10px;font-family:arial;" class

这是专门为CKEditor的开发人员准备的

目标是了解光标何时位于自定义属性范围的内部或外部

使用Ckeditor时,如果从插件中插入下面这样的自定义跨距,有时在您停止键入时,取消文本区域的焦点,并将cusor替换到行尾,就像您在继续键入之前停止的内容一样。文本可以在范围内,也可以在没有封装的范围外

取消焦点之前的示例:

    <span style="color:blue;line-height:12px;font-size:10px;font-family:arial;" class="master-span">
<span style="color:red;line-height:20px;font-size:18px;font-family:museo;" class="child-span">Text is here</span>
</span>

文本在这里
在“此处”结尾处重新聚焦并定位屏幕上的cusor,然后开始键入

<span style="color:blue;line-height:12px;font-size:10px;font-family:arial;" class="master-span">
<span style="color:red;line-height:20px;font-size:18px;font-family:museo;" class="child-span">Text is here</span> Text is now outside!!!
</span>

文本在这里文本现在在外面!!!
我想问的是,我将在哪里进行故障排除,以了解光标/锚点何时在范围内或范围外,即代码中是否进行了计算以确定这一点

进行此查询的原因是,span格式非常重要,我们不能在周围的文本区域中使用主span,因为这可以由用户更改。我们还发现,使用bulletpoints很麻烦,因为浏览器无法设置行高,因此确保文本始终在范围内将是一个很大的帮助

另外,我已经下载了源代码,看看在哪里可以找到它


非常感谢您的帮助。

单击我的任何CKeditor实例的文本区域后,我查找光标的父节点,查看它是否是LI节点。这表明光标落在了我的范围之外的一个项目符号内。我继续寻找我能找到的最外部的文本节点,因为我的假设是,如果光标在跨度之外,那么用户希望继续从最后一个字符开始键入

在我的设置中,一个跨距内可以有多个子跨距,且不受数量限制。因此,我必须找到最外侧的跨度,该跨度的末端(或靠近末端)有一个文本节点

我是通过获取节点列表并颠倒顺序来查找反向顺序中的第一个文本节点来完成的。我创建了一个函数,可以在找到第一个文本节点时循环span和break的数量

一旦有了文本节点,我就设置了范围并计算了文本的长度,以便将其放在末尾。下面是我在最新的Chrome/FF/IE上的最终解决方案

$(“#preview-text-3827”)。在(“单击”,函数(){
var CKEDITOR=window.parent.CKEDITOR;
var ck_instance_name=false;
for(CKEDITOR.instances中的var ck_实例){
if(CKEDITOR.instances[ck_instance].focusManager.hasFocus){
ck_instance_name=ck_instance;
打破
}
}
var editor=CKEDITOR.instances[ck_instance_name];
var selection=editor.getSelection();
var parent_attrs=“”;
if(selection.getType()==CKEDITOR.selection\u TEXT){
parent_attrs=selection.getStartElement();
if(父属性getName()=“li”){
var nodeList=parent_attrs.getChildren();
console.log(“现在反转”);
对于(var i=nodeList.count()-1;i>-1;--i){
//log(nodeList.getItem(i.nodeName);
var el=节点列表。获取项目(i);
如果(el.$.nodeName==“#文本”){
//这是最后一篇课文,但它在李的内部,这是错误的
}
如果(el.$.nodeName==“SPAN”){
//这应该是最后一个跨度
//跳进这个跨度,找到孩子们。
var结果=位移(el);
如果(result.text==true){
var内部=result.result;
var text=内部。$.textContent | |内部。$.innerText;
var length=text.length;
var range=editor.createRange();
范围。设置开始(内部,长度);
范围。设置端(内部,长度);
editor.getSelection().selectRanges([range]);
打破
}
}
}
}
}
});
功能定位(元件){
var returning=newobject();
returning.result=元素;
returning.text=false;
var结果=元素;
var nodeList=element.getChildren();
对于(var i=nodeList.count()-1;i>-1;--i){
var el=节点列表。获取项目(i);
如果(el.$.nodeName==“#文本”){
返回结果=el;
returning.text=true;
打破
}
如果(el.$.nodeName==“SPAN”){
//这应该是最后一个跨度
//跳进这个跨度,找到孩子们。
返回=回缩位置(el);
}
}
回归;
}
});