JS光标处理以及返回光标的下一个字符方法介绍

该文暂时只针对IE，非IE的暂时没考虑。

参考：
http://www.planabc.net/2010/11/17/get_textarea_cursor_position/ http://www.cnblogs.com/opencoder/articles/1459010.html http://www.jb51.net/article/23690.htm http://www.3lian.com/edu/2014/01-10/123085.html
针对可编辑div:

该js方法获取光标的下一个字符

function getDivChar(div){//获取光标后一个字符

if (document.selection) {

var range = document.selection.createRange(); //获取光标选中区域，

var range_all = document.body.createTextRange();

range_all.moveToElementText(div); //获取整个实体文本区域(create a selection of the whole div)

//如果双击时，本来就有选中文本，就不理

if(range_all.compareEndPoints("StartToStart",range) >= 0){

return;

}

//两个range，一个是已经选择的text(range)，一个是整个div(range_all)

//range_all.compareEndPoints()比较两个端点，如果range_all比range更往左(further to the left)，则 返回小于0的值，则range_all往右移一点，直到两个range的start相同。

// calculate selection start point by moving beginning of range_all to beginning of range

range_all.setEndPoint("StartToStart",range); //将整个文本区域的光标左端移动到选中区域的左端

//for (var start = 0; range_all.compareEndPoints("StartToStart",range) < 0; start++){ //直到移动到选中区域处

// range_all.moveStart('character', 1);

//}

//if(start == 0){ //有选中文本的双击不理

// return "0";

//}

return range_all.text.charAt(0); //返回光标处的下一个字符

}

}

比如整个div的文本是123456789，而我们这个光标先选中456这三个数字，那么

var range = document.selection.createRange(); //获取光标选中区域，如果没有选中区域，只有光标，那选中区域文本为空

range区域为456

以下这个是获取整个div的区域。

var range_all = document.body.createTextRange();

range_all.moveToElementText(div); //获取整个实体文本区域(create a selection of the whole div)

range_all区域为123456789

range_all.compareEndPoints("StartToStart",range) compareEndPoints这个方法

整个div文本区域跟选中文本区域的左端点比较，如果是整个div区域左端点在选中区域左端点左边，则返回-1，如果相等，返回0，如果在右边，返回1

这个方法可以判断两个文本区域哪个在左，哪个在右。

1在4的左边，所以返回-1

range_all.setEndPoint("StartToStart",range); setEndPoint这个方法将整个文本区域的光标左端移动到选中区域的左端

那么range_all的文本区域变为了456789，实际就是光标移动到文本区域左侧

range_all.text.charAt(0);那么就返回了光标的下一个字符

range.moveStart("character", n); //光标左端位置向前移动n位，-n则表示向后移动n位

range.moveEnd("character", n); //光标右端位置向前移动n位，-n则表示向后移动n位