1.背景：实现在textarea光标位置插入文字并移动光标到文字末尾

如果每次通过val("ss")赋值的形式插入文字到textarea中，会将上一次赋的值覆盖掉。

2.思路：

<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<title>Sliding Menu Effect</title>

<script type="text/javascript" language="javascript" src="jquery-2.1.1.min.js"></script>

<script type="text/javascript">

    function insertText(obj,str) {

        if (document.selection) {

            var sel = document.selection.createRange();

            sel.text = str;

        } else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {

            var startPos = obj.selectionStart,

            endPos = obj.selectionEnd,

            cursorPos = startPos,

            tmpStr = obj.value;

            obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);

            cursorPos += str.length;

            obj.selectionStart = obj.selectionEnd = cursorPos;

        } else {

            obj.value += str;

            }

        }

        function moveEnd(obj){

            obj.focus();

            var len = obj.value.length;

        if (document.selection) {

            var sel = obj.createTextRange();

            sel.moveStart('character',len);

            sel.collapse();

            sel.select();

        } else if (typeof obj.selectionStart == 'number' && typeof obj.selectionEnd == 'number') {

            obj.selectionStart = obj.selectionEnd = len;

        }

    }

</script>

</head>

<body>

    <input type="button" onclick="insertText(document.getElementById('text'),' 插入字符啊啊啊啊')" value="插入文字"></input>

    <input type="button" onclick="moveEnd(document.getElementById('text'))" value="光标移到末尾"></input>

    <textarea name="" id="text" cols="30" rows="10"></textarea>

</body>

</html>

　　

javascript实现在textarea光标位置插入文字并移动光标到文字末尾的更多相关文章

  1. textarea在光标位置插入文字

    最近开发类似计算器界面,需要在textarea中编辑公式,涉及到 在光标位置插入 字符. 效果如下: + - * / 添加文字 // html代码如下: <!doctype html> & ...

  2. js 在光标位置插入内容

    原文:https://blog.csdn.net/smartsmile2012/article/details/53642082 createDocumentFragment()用法: https:/ ...

  3. div 可编辑--获取光标位置插入元素

    <!DOCTYPE html> <html> <head>     <meta http-equiv="Content-Language" ...

  4. JQuery在光标位置插入内容

    (function($) { $.fn.extend({ insertAtCaret: function(myValue) { var $t = $(this)[0]; //IE if (docume ...

  5. 【转】怎么给javascript + div编辑框光标位置插入表情文字等？

    最近刚好碰到这个问题,虽然离提出问题已经过了半年了,本着前人栽树后人乘凉的精神,还是回答一下.效果: &amp;amp;amp;lt;img src="https://pic2.zh ...

  6. query或者JavaScript实现在textarea光标处插入文本

    1.Jquery函数实现: $(function() { /* 在textarea处插入文本--Start */ (function($) { $.fn.extend({ insertContent ...

  7. JS在可编辑的div中的光标位置插入内容或表情

    <input type="button" value="插入字符" onclick="document.getElementById('test ...

  8. winform中RichTextBox在指定光标位置插入图片

    代码如下: //获取RichTextBox控件中鼠标焦点的索引位置 int startPosition = this.richTextBox1.SelectionStart; //从鼠标焦点处开始选中 ...

  9. textarea光标处插入文字

    (function($) { $.fn.extend({ //myField 对象元素 myValue 插入值 insertAtCursor: function(myField,myValue) { ...

随机推荐

  1. POJ-2139 Six Degrees of Cowvin Bacon---Floyd

    题目链接: https://vjudge.net/problem/POJ-2139 题目大意: 给定一些牛的关系,他们之间的距离为1. 然后求当前这只牛到每只牛的最短路的和,除以 n - 1只牛的最大 ...

  2. 2019.03.09 ZJOI2019模拟赛 解题报告

    得分: \(20+0+40=60\)(\(T1\)大暴力,\(T2\)分类讨论写挂,\(T3\)分类讨论\(40\)分) \(T1\):天空碎片 一道神仙数学题,貌似需要两次使用中国剩余定理. 反正不 ...

  3. Uva 10375 选择与除法 唯一分解定理

    题目链接:https://vjudge.net/contest/156903#problem/E 题意:已知 求:C(p,q)/C(r,s) 其中p,q,r,s都是10^4,硬算是肯定超数据类型的. ...

  4. 检测pycaffe安装好没

    进入python然后import caffe,如果没报错就表示安装好了

  5. EF中 实现延迟加载 lazyload

    1.创建数据库 2.利用数据库 生成视图 生成2个实体类 和一个model1类 3.写代码 (1) 创建 上下文对象 (2) (3)查询结果 注释: 延迟加载的原因,因为我们操作数据库不会那么简单, ...

  6. 从Java官网下载JDK1.6等低版本JDK

    今天在浏览Java官网的时候发现旧版本(1.8之前)的JDK安装包下载地址没有在下载页面明显的提供出来.个人通过在官网查看,发现oracle官方将旧版本的JDK全都放在Java Archive模块中了 ...

  7. CUDA内存拷贝

    原文链接1.cudaMemcpy()<--> cudaMalloc()  //线性内存拷贝 1 //线性内存拷贝 2 cudaMalloc((void**)&dev_A, data ...

  8. rnn,cnn

    http://nikhilbuduma.com/2015/01/11/a-deep-dive-into-recurrent-neural-networks/ 按照这里的介绍,目前比较火的cnn是fee ...

  9. EAIntroView–高度可定制的iOS应用欢迎页通用解决方案

    简介 高度可定制的应用欢迎页通用解决方案,可高度定制,不要仅限于现有的demo. 项目主页: EAIntroView 最新示例: 点击下载 入门 安装 安装后,引入” EAIntroView.h”并设 ...

  10. 简单webservice实现（xFire1.2）

    基于xfire实现webservice的实例 首先下载xfire的jar包,并导入项目当中 下载地址:http://xfire.codehaus.org/Download 编写实现类 首先建一个接口把 ...