ahjesus 获取div编辑框，textarea，input text的光标位置 兼容IE，FF和Chrome

ahjesus 返回光标位置兼容IE，FF和Chrome，

说明更新（2013-04-24）{

今天收到反馈说这个例子没作用了，经过查证测试发现是因为使用的jquery的版本过高引起的

$(element).attr("tagName") 这个是非官方的用法 所以版本变化会有影响 如果要使用更高版本jquery，获取tagName改成原生就可以了

或者调整其他获取tagName的方式

}

网上苦找2小时，全是不能兼容FF的，看来这种东西网上是搞不到现成的了，只能自己动手丰衣足食

现在发布出来，今后网上就有现成的供人使用了。

为了省事，少量位置用了jquery 改原生JS也很方便，谁需要就请自己修改了。

欢迎各位路过高人拍板，欢迎各位留言提供改进代码。

又改进 兼容了Chrome 下面的代码已修改成最新版

上源码了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>js获取div编辑框，textarea，input text的光标位置，兼容FF和IE</title>
    <script src="jquery-1.4.4.js" type="text/javascript"></script>
    <script type="text/javascript">
        //去除左右所有空格
        String.prototype.trim = function () {
            return this.replace(/(^\s*)|(\s*$)/g, "");
        }
        function getPosition(element) {
            var OsObject = "";
            if (navigator.userAgent.indexOf("MSIE") > 0) {
                OsObject = "MSIE";
            }
            if (navigator.userAgent.indexOf("Firefox") > 0) {
                OsObject = "Firefox";
            }
            if (navigator.userAgent.indexOf("Safari") > 0) {
                OsObject = "Safari";
            }
            if (navigator.userAgent.indexOf("Camino") > 0) {
                OsObject = "Camino";
            }
            if (navigator.userAgent.indexOf("Gecko") > 0) {
                OsObject = "Gecko";
            }
            if (navigator.userAgent.indexOf("Chrome") > 0) {
                OsObject = "Chrome";
            } 
            
            var result = 0;
            if (!document.selection) { //非IE浏览器
                var thisTagName = null;
                if ($(element).attr("tagName") != "TEXTAREA" && $(element).attr("tagName") != "INPUT") {
                    if ($(element).attr("tagName") == "DIV" && $(element).attr("contenteditable") == "true") {
                        thisTagName = window.getSelection().anchorNode.parentElement.tagName;                        
                    } //出自http://www.cnblogs.com/ahjesus 尊重作者辛苦劳动成果，转载请注明出处，谢谢！
                    else {
                        thisTagName == null;
                    }
                }
                else {                    
                    if ($(element).attr("tagName") == "INPUT" && $(element).attr("type") == "text") {
                        thisTagName = window.getSelection().anchorNode.tagName;
                    }
                    else {
                        console.log(window.getSelection());                     
                        thisTagName = window.getSelection().anchorNode.tagName;
                    }
                }
                console.log(thisTagName);
                if (thisTagName == "TEXTAREA" || thisTagName == "INPUT" || (thisTagName=="BODY"&&OsObject == "Chrome")) {
                    result = element.selectionStart
                } //出自http://www.cnblogs.com/ahjesus 尊重作者辛苦劳动成果，转载请注明出处，谢谢！                
                else if (thisTagName != null) {
                    if (thisTagName == element.tagName) {
                        if (window.getSelection().anchorNode.textContent == $(element).text()) {
                            result = window.getSelection().anchorOffset;
                        }
                        else {
                            var currentIndex = window.getSelection().anchorOffset;
                            var txt = "";
                            var txtoo = window.getSelection().anchorNode.previousSibling;
                            while (txtoo != null) {
                                txt += txtoo.textContent;
                                txtoo = txtoo.previousSibling;
                            } //出自http://www.cnblogs.com/ahjesus 尊重作者辛苦劳动成果，转载请注明出处，谢谢！
                            result = txt.length + currentIndex;
                        }
                    }
                    else {
                        var currentIndex = window.getSelection().anchorOffset;
                        var txt = "";
                        var txtoo = window.getSelection().anchorNode.parentElement.previousSibling;
                        while (txtoo != null) {
                            txt += txtoo.textContent;
                            txtoo = txtoo.previousSibling;
                        }
                        result = txt.length + currentIndex;
                    }
                } //出自http://www.cnblogs.com/ahjesus 尊重作者辛苦劳动成果，转载请注明出处，谢谢！
                else {
                    return 0;
                }
            } else { //IE
                var rng;
                if ($(element).attr("tagName") == "TEXTAREA" || ($(element).attr("tagName") == "INPUT" && $(element).attr("type") == "text") || ($(element).attr("tagName") == "DIV" && $(element).attr("contenteditable") == "true")) {
                    element.focus();
                    rng = document.selection.createRange();
                    rng.moveStart('character', -element.innerText.length);
                    var text = rng.text;
                    for (var i = 0; i < element.innerText.length; i++) {
                        if (element.innerText.substring(0, i + 1) == text.substring(text.length - i - 1, text.length)) {
                            result = i + 1;
                        }
                    }
                } //出自http://www.cnblogs.com/ahjesus 尊重作者辛苦劳动成果，转载请注明出处，谢谢！
                else {
                    return 0;
                }
            }
            return result;
        }

        function getValue(element) {
            var pos = getPosition(element);
            document.getElementById("pnum").value = pos;
        }

    </script>
    <style type="text/css">
        #Div1, #Div2
        {
            width: 500px;
            height: 100px;
            border: solid 1px black;
        }
    </style>
</head>
<body>
    <input id="pnum" type="text" value="Hello,wellcome to test! 你好,欢迎测试!" onmouseup="getValue(this)"
        style="display: block" />
    <textarea cols="60" rows="10" onkeyup="getValue(this)" onmouseup="getValue(this)">Hello,wellcome to test! 你好,欢迎测试! 注意源代码开闭合标记之间不能换行，否则统计错误！</textarea>
    <div id="Div1" onclick="getValue(this);" onkeyup="getValue(this);" contenteditable="true">一二三<span>四五</span>六七八<span>九零</span> 注意源代码开闭合标记之间不能换行，否则统计错误！注意div编辑框源码里面是嵌套有其他标签的，可以正常返回正确位置！</div>
    <br />
    <div id="Div2" onclick="getValue(this);" onkeyup="getValue(this);">一二三四五六<span>七八</span></div>
</body>
</html>
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/ahjesus/p/2760402.html