代码如下：

<!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获取编辑框游标的位置</title>

    <script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.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)[0].nodeName != "TEXTAREA" && $(element)[0].nodeName != "INPUT") {

                    if ($(element)[0].nodeName == "DIV" && $(element).attr("contenteditable") == "true") {

                        thisTagName = window.getSelection().anchorNode.parentElement.tagName;

                    }

                    else {

                        thisTagName == null;

                    }

                }

                else {

                    if ($(element)[0].nodeName == "INPUT" && $(element).attr("type") == "text") {

                        thisTagName = window.getSelection().anchorNode.tagName;

                    }

                    else {

                        console.log(window.getSelection());

                        thisTagName = window.getSelection().anchorNode.tagName;

                    }

                }

                if (thisTagName == "TEXTAREA" || thisTagName == "INPUT" || (thisTagName=="BODY"&&OsObject == "Chrome")) {

                    result = element.selectionStart;

                }

                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;

                            }

                            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;

                    }

                }

                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;

                        }

                    }

                }

                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>

    <div id="Div2" onclick="getValue(this);" onkeyup="getValue(this);">一二三四五六<span>七八</span></div>

</body>

</html>

js获取编辑框游标的位置的更多相关文章

  1. js获取单选框的值

    js获取单选框的值 var lx= $("input[name='lx']:checked").val();

  2. js点击获取—通过JS获取图片的相对坐标位置

    一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...

  3. MFC如何获取编辑框中输入的内容

    1.GetDlgItemText() 2.先用 GetDlgItem(编辑框的ID)获取指向编辑框的指针.再用GetWindowText函数将获取内容保存至指定的字符数组里. 3.使用 GetDlgI ...

  4. MFC中窗口启动后，CEdit编辑框默认光标位置设置，顺序的调节方法

    MFC中窗口启动后,CEdit编辑框默认光标位设置,顺序的调节方法 在编辑界面按下ctrl+D键,就会出现所有控件的Tab键顺序,按照自己想要的顺序依次点击控件,就可以重新安排顺序.数值1就是默认停留 ...

  5. js获取输入框中当前光标位置并在此位置插入字符串的方法(angularjs+ts)

    一半是参照别人代码,一半是自己代码,略笨拙,如果有更好的方法希望分享. 获取当前光标位置的方法 getCaretPosition (obj:any) { //获取输入框中当前光标的位置,obj为此输入 ...

  6. js获取单选框里面的值

    rt,如果想获取单选框里面的值,该如何获取呢. <script> window.onload = function(){ //通过名字获取 getElementsByName //var ...

  7. js获取单选框radio的值

    遇到一个js获取radio值的问题,原来根据frm.type.value取到的值在ie下是空值 解决办法:type为每个radio的值 var chkObjs=document.getElements ...

  8. VC++ 学习笔记3 获取编辑框字符串

    边界框添加字符串比较简单 可以直接在对话框的空间上面点击右键添加变量,变量类型为CString  在此取名为m_NUM 直接使用m_NUM就是编辑框的CString, 举例: 在messagebox显 ...

  9. js 获取单选框和复选框的值和js dom方法给单选框和多选框赋值

    获取单选框框值的方法 function getRadioRes(Name){ var rdsObj = document.getElementsByName(Name); var checkVal = ...

随机推荐

  1. ViewGroup可实现上下、各地跑马灯效果滚动

    先上效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdGFuZ25lbmd3dQ==/font/5a6L5L2T/fontsize/400/fill ...

  2. C++几个小函数

    之前看书,遇到几个编程题,要实现一些库自带的函数.于是动手写了写,并且做了一些测试.今晚在测试的时候,还发现了一些其他内存分配的问题,顺路一起记下.这里只写了字符串转整型,字符串赋值函数. #incl ...

  3. SQL操作语句中的注意点

    一 查询语句 1 distinctkeyword消除反复行 当查询的结果数据中出现反复数据时.在查询条件中加上distinctkeyword消除反复行: 如:select distinct Sno f ...

  4. MVC中使用SignalR

    MVC中使用SignalR打造酷炫实用的即时通讯功能附源码   前言,现在这世道写篇帖子没个前言真不好意思发出来.本贴的主要内容来自于本人在之前项目中所开发的一个小功能,用于OA中的即时通讯.由于当时 ...

  5. 从涂鸦到发布——理解API的设计过程（转）

    英文原文:From Doodles to Delivery: An API Design Process 要想设计出可以正常运行的Web API,对基于web的应用的基本理解是一个良好的基础.但如果你 ...

  6. jQuery语音播放插件

    自己做jQuery插件:将audio5js封装成jQuery语音播放插件   日前的一个项目需要用到语音播放功能.发现Audio5js符合需求且使用简单,又鉴于jQuery控件便于开发操作,于是有了以 ...

  7. [2013山东ACM]省赛 The number of steps （可能DP，数学期望）

    The number of steps nid=24#time" style="padding-bottom:0px; margin:0px; padding-left:0px; ...

  8. MongoDB初学者的配置环境和基础设施的使用

    一个.mongoDB安装 1.第一MongoDB官方网站下载安装包http://www.mongodb.org/. 依照自己的操作系统进行下载. 2.在硬盘上建立两个文件夹分辨存放mongoDB安装文 ...

  9. 十天学Linux内核之第四天---如何处理输入输出操作

    原文:十天学Linux内核之第四天---如何处理输入输出操作 真的是悲喜交加呀,本来这个寒假早上8点都去练车,两个小时之后再来实验室陪伴Linux内核,但是今天教练说没名额考试了,好纠结,不过想想就可 ...

  10. ftp server来源分析20140602

    ftp  server学习位和源代码分析片 记录自己的第一个开源的分析过程: 从源代码:野狐灯(我接下来的几篇文章是从源头:野狐灯,每个以下哪项不是他们设置.) 20140602 Ftp的源码目录例如 ...