JQ在光标处插入文字

Posted 2020-10-26 北纬95度

内容转载自网络
这是一个JQ的扩展方法。在teatarea获得焦点时，往光标处插入文字，扩展代码如下

(function($){
        $.fn.extend({
            "insert":function(value){
                //默认参数
                value=$.extend({
                    "text":"123"
                },value);
                var dthis = $(this)[0]; //将jQuery对象转换为DOM元素
                //IE下
                if(document.selection){
                    $(dthis).focus(); //输入元素textara获取焦点
                    var fus = document.selection.createRange();//获取光标位置
                    fus.text = value.text; //在光标位置插入值
                    $(dthis).focus(); ///输入元素textara获取焦点
                }
                //火狐下标准
                else if(dthis.selectionStart || dthis.selectionStart == ‘0‘){
                    var start = dthis.selectionStart; 　　 //获取焦点前坐标
                    var end =dthis.selectionEnd; 　　//获取焦点后坐标
                    //以下这句，应该是在焦点之前，和焦点之后的位置，中间插入我们传入的值 .然后把这个得到的新值，赋给文本框
                    dthis.value = dthis.value.substring(0, start) + value.text + dthis.value.substring(end, dthis.value.length); }
                //在输入元素textara没有定位光标的情况
                else{
                    this.value += value.text; this.focus();
                };
                return $(this);
            }
        })
    })(jQuery)

扩展方法调用方法为

//给按钮添加点击事件，
$(‘#btn‘).on(‘click‘,function(){
    $("目标textarea框").insert({"text":"要添加的文字"});
});