代码如下：

<!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. Java 新特性(2) - JDK6 新特性

    http://freesea.iteye.com/blog/160133 JDK6的新特性之一_Desktop类和SystemTray类 JDK6的新特性之二_使用JAXB2来实现对象与XML之间的映 ...

  2. Simditor图片上传

    上一篇文章(Simditor用法)仅仅是简单的默认配置,我们可自己定义工具栏button使其更丰富和实现上传图片功能 初始化编辑器 <script type="text/javascr ...

  3. Swift: 打造滑动解锁文字动画

    原文:Swift: 打造滑动解锁文字动画 最近木事,找出来玩了玩facebook的paper.到处都是那个"slide to unlock your phone"的效果啊.忽闪忽闪 ...

  4. 数组、链表、Hash（转）

    在程序中,存放指定的数据最常用的数据结构有两种:数组和链表. 数组和链表的区别: 1.数组是将元素在内存中连续存放. 链表中的元素在内存中不是顺序存储的,而是通过存在元素中的指针联系到一起. 2.数组 ...

  5. 数据库文档生成工具——word2chm，SqlSpec

    首先使用代码生成器可以生成word版本的数据库文档. 转成chm格式的更加小巧和方便~ SqlSpec是个好工具,可以生成所有数据库相关的信息 之后可以一键生成chm文档.

  6. 持续集成并不能消除 Bug，而是让它们非常容易发现和改正（转）

    互联网软件的开发和发布,已经形成了一套标准流程,最重要的组成部分就是持续集成(Continuous integration,简称 CI). 本文简要介绍持续集成的概念和做法. 一.概念 持续集成指的是 ...

  7. 组合数处理(逆元求解)...Orz

    网上发现了不错的博客讲解... 熊猫的板子:http://blog.csdn.net/qq_32734731/article/details/51484729 组合数的预处理(费马小定理|杨辉三角|卢 ...

  8. HDOJ 3037 Saving Beans

    如果您有n+1树,文章n+1埋不足一棵树m种子,法国隔C[n+m][m] 大量的组合,以取mod使用Lucas定理: Lucas(n,m,p) = C[n%p][m%p] × Lucas(n/p,m/ ...

  9. LinkedBlockingQueue多线程测试

    public class FillQueueThread extends Thread { private Queue queue; public FillQueueThread(Queue queu ...

  10. oracle_删除同一列的重复数据

    <!--删除同一列的重复数据 rowid 在orcle中 数据的物理地址---> delete from tbl_over_picture_alarm a where rowid not ...