获取光标的像素位置、索引位置

最近工作中有一个需求，需要根据用户的输入判断如果为“@”字符，需要在旁边弹出一个变量框，让用户选择变量。这里就遇到了两个问题：
1、获取光标的像素位置，这样才能判断输入框在哪个位置弹出
2、获取光标在输入框的索引位置，这样才能把变量放进输入框

1、对于第一个问题的解决其实很简单，JQuery有一款插件：jquery.caret——可以很方便的取得相对父元素的定位，或者相对浏览器窗口的定位。

// Get caret position 
$('#input').caret('position'); // => {left: 15, top: 30, height: 20} 

// Get caret offset 
$('#input').caret('offset'); // => {left: 300, top: 400, height: 20} 

2、对于dom元素，假如它的的ID为input：

var input = document.getElementById("input");
input.selectionStart

即可获得。IE低版本浏览器待验证。