zoukankan      html  css  js  c++  java
  • textarea元素获取焦点光标定位最后一个字符

    html元素中textarea就是一个鸡肋, 其获取焦点光标无法定位到最后一个字符. 笔者在项目中有一个简易的富文本框, 要求用户即可以输入字符同时支持表情符。当用选择表情后textarea获取焦点, 在浏览器chrome下面光标始终停留在textarea首位, 结论是各个浏览器对textare元素的focus实现有所差异

    解决方案如下:

    <script type="text/javascript">
    function moveCaretToEnd(el) {
        if (typeof el.selectionStart == "number") {
            el.selectionStart = el.selectionEnd = el.value.length;
        } else if (typeof el.createTextRange != "undefined") {
            el.focus();
            var range = el.createTextRange();
            range.collapse(false);
            range.select();
        }
    }
    
    var textarea = document.getElementById("test");
    textarea.onfocus = function() {
        moveCaretToEnd(textarea);
    
        // Work around Chrome's little problem
        window.setTimeout(function() {
            moveCaretToEnd(textarea);
        }, 1);
    };
    </script>
    
    <textarea id="test">Something</textarea>

    作者:Olar Tan
    出处:http://www.cnblogs.com/olartan
    ♪:没有做不到的 只有偷懒而错过的 ♪

  • 相关阅读:
    阿里巴巴Java编码规范插件安装使用指南
    jhipster安装_Windows
    Linux 基本命令
    HTTPie命令介绍
    MySQL卸载
    Windows Phone8.1系统新特性
    SQL 游标知识整理
    浅析C#代理
    javascript 实现ajax
    jquery 之load post get
  • 原文地址:https://www.cnblogs.com/olartan/p/2657986.html
Copyright © 2011-2022 走看看