zoukankan      html  css  js  c++  java
  • 取得光标位置

    取得光标位置

    取得光标位置

    最近在项目中遇到了一个取得光标位置相关的BUG。现总结如下:

    环境

    BUG现象

    问题很简单,画面上有一个textarea,还有一个button,当客户点击button的时候想向textarea中当前光标位置,插入一段固定的话。当然实际系统中业务比这个要复杂一些,但基本就是这么一回事。问题的关键是textarea的光标当前位置的计算。 客户在画面输入两行文字,光标停在了第二行的开始。但是文字确插入在了第一行的末尾。 这很明显是个BUG。

    BUG解析

    以前的代码:

    info.activeElement = document.activeElement;
    info
    .activeElement.focus();
    var range = document.selection.createRange();
    var objRange = info.activeElement.createTextRange();
    objRange
    .collapse(true);
    objRange
    .select();
    range
    .setEndPoint("StartToStart", document.selection.createRange());
    info
    .cursorPos = range.text.length;

    问题很简单range.text的选区当中没有包含末尾的回车。

    BUG解决

    修改:

    info.activeElement = document.activeElement;
    info
    .activeElement.focus();
    var range = document.selection.createRange();
    var objRange = info.activeElement.createTextRange();
    objRange
    .collapse(false);
    objRange
    .select();
    range
    .setEndPoint("StartToStart", document.selection.createRange());
    info
    .cursorPos = nfo.activeElement.value.length - range.text.length;

    以前是把光标之前的部分做成选区。再计算文字的个数。 修改后是把光标之后的部分做成选区。计算文字个数,再用总文字去减。

    总结

    虽然改出来了,但还是没太明白为什么。

  • 相关阅读:
    Hadoop1.2.0开发笔记(四)
    Datalist、GridView、Repeater 的区别
    oAuth
    浏览器沙箱技术
    28个HTML5特征、窍门和技术
    在Windows 8 JavaScript Metro Application 开发
    CSS浮动属性Float详解
    Windows 8为什么会是开发人员的2012
    CSS实现截取隐藏文字
    国外可绑定域名的免费空间(精选)
  • 原文地址:https://www.cnblogs.com/tjpanda88/p/2199662.html
Copyright © 2011-2022 走看看