zoukankan html css js c++ java

将光标定位于输入框最右侧的实现方式

这个方法setCursorPosition需要使用两个原生API

setSelectionRange
createTextRange

<html>
    <head>
        <title></title>
        <script src="./js/jquery-2.2.2.min.js"></script>
    </head>
    <body>
        <input type="text" id="test" />
        
        <script>
            (function($, undefined) {
                $.fn.getCursorPosition = function() {
                    var el = $(this).get(0);
                    var pos = 0;
                    if ('selectionStart' in el) {
                        pos = el.selectionStart;
                    } else if ('selection' in document) {
                        el.focus();
                        var Sel = document.selection.createRange();
                        var SelLength = document.selection.createRange().text.length;
                        Sel.moveStart('character', -el.value.length);
                        pos = Sel.text.length - SelLength;
                    }
                    return pos;
                };
                
                $.fn.setCursorPosition = function(option) {
                    var settings = $.extend({
                        index: 0
                    }, option);
                    return this.each(function() {
                        var elem  = this;
                        var val   = elem.value;
                        var len   = val.length;
                        var index = settings.index;
                 
                        // 非input和textarea直接返回
                        var $elem = $(elem);
                        if (!$elem.is('input,textarea')) {
                            return;
                        }
                        // 超过文本长度直接返回
                        if (len < index) {
                            return;
                        }
                 
                        setTimeout(function() {
                            elem.focus()
                            if (elem.setSelectionRange) { // 标准浏览器
                                elem.setSelectionRange(index, index)   ;
                            } else { // IE9-
                                var range = elem.createTextRange();
                                range.moveStart("character", -len);
                                range.moveEnd("character", -len);
                                range.moveStart("character", index);
                                range.moveEnd("character", 0);
                                range.select();
                            }
                        }, 10);
                    });
                };
            })(jQuery);
            
            $("#test").on("focus", function(){
                var pos = $(this).getCursorPosition();
                $(this).setCursorPosition({index:$(this).val().length});
            });
        </script>
    </body>
</html>

Source:

http://www.uncletoo.com/html/jsjquery/755.html

http://www.cnblogs.com/snandy/p/4112488.html

查看全文

相关阅读:
浏览器驱动器下载地址
 7.pytest测试完成后通过allure生成测试报告
 6.pytest参数化操作
 5.pytest中fixture的使用（params参数）
5.pytest中fixture的使用（scope参数）
4.pytest中固定装置setup和teardown
3.pytest函数级测试用例和类级测试用例
 2.pytest用例设计及运行
 1.pytest环境搭建
 Pycharm 常用快捷键

原文地址：https://www.cnblogs.com/zcynine/p/5333190.html