<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
</head>
<body>
<textarea name="" id="edit" cols="100" rows="10"></textarea>
<button onclick="getPos()">获取光标位置</button>
<button onclick="getSelect()">获取选中内容</button>
<button onclick="insert()">插入文本</button>
<script>
$.extend($.fn,{
//获取文本框内光标位置
getSelectionStart: function() {
var e = this[0];
if (e.selectionStart) {
return e.selectionStart;
} else if (document.selection) {
e.focus();
var r=document.selection.createRange();
var sr = r.duplicate();
sr.moveToElementText(e);
sr.setEndPoint('EndToEnd', r);
return sr.text.length - r.text.length;
} return 0;
},
getSelectionEnd: function() {
var e = this[0];
if (e.selectionEnd) {
return e.selectionEnd;
} else if (document.selection) {
e.focus();
var r=document.selection.createRange();
var sr = r.duplicate();
sr.moveToElementText(e);
sr.setEndPoint('EndToEnd', r);
return sr.text.length;
}
return 0;
},
//自动插入默认字符串
insertString: function(str) {
$(this).each(function() {
var tb = $(this);
tb.focus();
if (document.selection){
var r = document.selection.createRange();
document.selection.empty();
r.text = str;
r.collapse();
r.select();
} else {
var newstart = tb.get(0).selectionStart+str.length;
tb.val(tb.val().substr(0,tb.get(0).selectionStart) +
str + tb.val().substring(tb.get(0).selectionEnd));
tb.get(0).selectionStart = newstart;
tb.get(0).selectionEnd = newstart;
}
}); return this;
},
setSelection: function(startIndex,len) {
$(this).each(function(){
if (this.setSelectionRange){
this.setSelectionRange(startIndex, startIndex + len);
} else if (document.selection) {
var range = this.createTextRange();
range.collapse(true);
range.moveStart('character', startIndex);
range.moveEnd('character', len);
range.select();
} else {
this.selectionStart = startIndex;
this.selectionEnd = startIndex + len;
}
}); return this;
},
getSelection: function() {
var elem = this[0]; var sel = '';
if (document.selection){
var r = document.selection.createRange();
document.selection.empty();
sel = r.text;
} else {
var start = elem.selectionStart;
var end = elem.selectionEnd;
var content = $(elem).is(':input') ? $(elem).val() : $(elem).text();
sel = content.substring(start, end);
}
return sel;
}
})
</script>
<script>
function getPos(){
alert($("#edit").getSelectionStart());
}
function getSelect(){
alert($("#edit").getSelection());
}
function insert(){
$("#edit").insertString("hello"); }
</script>
</body>
</html>

  

js 光标选中 操作的更多相关文章

  1. js光标定位操作

    1. 自动选中区域内容 <html> <meta http-equiv="Content-Type" content="text/html; chars ...

  2. 斗篷指令、属性指令、表单指令、条件指令、循环指令、js的Array操作、前台数据库、

    ```python"""1)指令 属性指令:v-bind 表达指令:v-model 条件指令:v-show v-if 循环指令:v-for 斗篷指令:v-cloak 2) ...

  3. js实现动态操作table

     本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...

  4. nw.js如何处理拖放操作

    nw.js如何处理拖放操作 其实拖放(drag-drop)操作是Html5的功能,不是nw.js的内置API,那么我们采用Html5应用一般的处理方法就可以了. 首先我们看一下一个正常的页面,直接拖放 ...

  5. Numeral.js – 格式化和操作数字的 JavaScript 库

    Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...

  6. 【软件编程】乐易贵宾VIP教程 - JS改写+网页操作系列教程

    JS改写系列教程: 1.MD5加密改写教程(爱拍网登录)2.解密如何快速找到真确的js加密算法3.多重MD5加密改写教程(5173登录)4.DZ论坛登录加密改写5.唯品会手机登录加密改写6.新浪微博密 ...

  7. JS实现 键盘操作

    JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C// ...

  8. js中如何操作json数据

    一.要想熟练的操作json数据,就先要了解json数据的结构,json有两种结构:对象和数组. 1.对象 一个对象以“{”开始,“}”结束.每个“名称”后跟一个“:”:“‘名称/值’ 对”之间使用“, ...

  9. js数组的操作及数组与字符串的相互转化

    数组与字符串的相互转化 <script type="text/javascript">var obj="new1abcdefg".replace(/ ...

随机推荐

  1. 关于Android项目隐藏标题栏的方法总结

    1.在代码中添加这么一行代码 this.requestWindowFeature(Window.FEATURE_NO_TITLE); 注意:这段代码需要写在setContentView()之前,否则会 ...

  2. 自定义HTTP头时的注意事项(转)

    原文:https://blog.gnuers.org/?p=462 HTTP头是可以包含英文字母([A-Za-z]).数字([0-9]).连接号(-)hyphens, 也可义是下划线(_).在使用ng ...

  3. Python并行编程(一):基本概念

    1.线程和进程 进程是应用程序的一个执行实例,比如,在桌面上双击浏览器将会运行一个浏览器.线程是一个控制流程,可以在进程内与其他活跃的线程同时执行.控制流程指的是顺序执行一些机器指令.进程可以包含多个 ...

  4. Flask之视图函数

    视图示例 @app.route('/hello') def hello(): return 'Hello World' if __name__ == '__main__': app.run() 特殊的 ...

  5. python 面向对象(进阶篇)转载武沛齐

    上一篇<Python 面向对象(初级篇)>文章介绍了面向对象基本知识: 面向对象是一种编程方式,此编程方式的实现是基于对 类 和 对象 的使用 类 是一个模板,模板中包装了多个“函数”供使 ...

  6. rtsp/rtmp/hls/onvif测试源以及ffmpeg在流媒体方面的应用

    一.rtsp/rtmp/hls/onvif测试源 1. rtsp rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov 2.rtmp rtmp://l ...

  7. linux ipc/its

    linux进程间双向消息队列 server.c #include <stdio.h> #include <stdlib.h> #include <string.h> ...

  8. Spark2.0 特征提取、转换、选择之二:特征选择、文本处理,以中文自然语言处理(情感分类)为例

    特征选择 RFormula RFormula是一个很方便,也很强大的Feature选择(自由组合的)工具. 输入string 进行独热编码(见下面例子country) 输入数值型转换为double(见 ...

  9. django xadmin app models 注册

    在app下新建adminx.py文件 # -*- coding: utf-8 -*- # 作者:神秘藏宝室 # 日期:2018/12/28 22:07 import xadmin from .mode ...

  10. 机器学习第7周-炼数成金-支持向量机SVM

    支持向量机SVM 原创性(非组合)的具有明显直观几何意义的分类算法,具有较高的准确率源于Vapnik和Chervonenkis关于统计学习的早期工作(1971年),第一篇有关论文由Boser.Guyo ...