• 获取文本域中的光标所在的位置


    最近在一个项目中有个功能,需要获取光标所在的位置,并设置光标的位置,

     <script>  
         var isIE = !(!document.all);   
         function posCursor(){   
           var start=0,end=0;   
           var oTextarea = document.getElementById("textarea");   
           if(isIE){   
             //selection 当前激活选中区,即高亮文本块,和/或文当中用户可执行某些操作的其它元素。   
             //createRange 从当前文本选中区中创建 TextRange 对象,   
             //或从控件选中区中创建 controlRange 集合。   
             var sTextRange= document.selection.createRange();   
     
             //判断选中的是不是textarea对象   
             if(sTextRange.parentElement()== oTextarea){   
               //创建一个TextRange对象   
               var oTextRange = document.body.createTextRange();   
               //移动文本范围以便范围的开始和结束位置能够完全包含给定元素的文本。   
               oTextRange.moveToElementText(oTextarea);   
                 
               //此时得到两个 TextRange   
               //oTextRange文本域(textarea)中文本的TextRange对象   
               //sTextRange是选中区域文本的TextRange对象   
           
               //compareEndPoints方法介绍,compareEndPoints方法用于比较两个TextRange对象的位置   
               //StartToEnd   比较TextRange开头与参数TextRange的末尾。   
               //StartToStart比较TextRange开头与参数TextRange的开头。   
               //EndToStart   比较TextRange末尾与参数TextRange的开头。   
               //EndToEnd     比较TextRange末尾与参数TextRange的末尾。   
           
               //moveStart方法介绍,更改范围的开始位置   
               //character 按字符移动   
               //word        按单词移动   
               //sentence   按句子移动   
               //textedit   启动编辑动作   
           
               //这里我们比较oTextRange和sTextRange的开头,的到选中区域的开头位置   
               for (start=0; oTextRange.compareEndPoints("StartToStart", sTextRange) < 0; start++){   
                 oTextRange.moveStart('character', 1);   
               }   
               //需要计算一下\n的数目(按字符移动的方式不计\n,所以这里加上)   
               for (var i = 0; i <= start; i ++){   
                 if (oTextarea.value.charAt(i) == '\n'){   
                   start++;   
                 }   
               }   
           
               //在计算一次结束的位置   
               oTextRange.moveToElementText(oTextarea);   
               for (end = 0; oTextRange.compareEndPoints('StartToEnd', sTextRange) < 0; end ++){   
                 oTextRange.moveStart('character', 1);   
               }   
               for (var i = 0; i <= end; i ++){   
                 if (oTextarea.value.charAt(i) == '\n'){   
                   end++;   
                 }   
               }   
             }   
           }else{   
            start = oTextarea.selectionStart;   
            end = oTextarea.selectionEnd;   
           }   
           document.getElementById("start").value = start;   
           document.getElementById("end").value = end;   
         }   
           
           
         function moveCursor(){   
           var oTextarea = document.getElementById("textarea");   
           var start = parseInt(document.getElementById("start").value);   
           var end =  parseInt(document.getElementById("end").value);   
           if(isNaN(start)||isNaN(end)){   
             alert("位置输入错误");   
           }   
           if(isIE){   
             var oTextRange = oTextarea.createTextRange();   
             var LStart = start;   
             var LEnd = end;   
             var start = 0;   
             var end = 0;   
             var value = oTextarea.value;   
             for(var i=0; i<value.length && i<LStart; i++){   
               var c = value.charAt(i);   
               if(c!='\n'){   
                 start++;   
               }   
             }   
             for(var i=value.length-1; i>=LEnd && i>=0; i--){   
               var c = value.charAt(i);   
               if(c!='\n'){   
                 end++;   
               }   
             }   
             oTextRange.moveStart('character', start);   
             oTextRange.moveEnd('character', -end);   
             //oTextRange.collapse(true);   
             oTextRange.select();   
             oTextarea.focus();   
           }else{   
             oTextarea.select();   
            oTextarea.selectionStart=start;   
            oTextarea.selectionEnd=end;   
           }   
         }   
      </script> 

  • 相关阅读:
    python pytesseract模块,报错
    CSS清除浮动_清除float浮动
    CSS中@import与link的具体区别
    js substr和substring的区别
    WebStorm 自定义字体+颜色+语法高亮+导入导出用户设置
    Jquery中的重置
    table标签中thead、tbody、tfoot的作用
    下拉列表框的几个属性
    使用GDI绘制文本
    使用GDI绘制一条直线
  • 原文地址:https://www.cnblogs.com/xiaohui108/p/2298302.html
Copyright © 2020-2023  润新知