js 光标选中 操作
<!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 光标选中 操作的更多相关文章
- js光标定位操作
1. 自动选中区域内容 <html> <meta http-equiv="Content-Type" content="text/html; chars ...
- 斗篷指令、属性指令、表单指令、条件指令、循环指令、js的Array操作、前台数据库、
```python"""1)指令 属性指令:v-bind 表达指令:v-model 条件指令:v-show v-if 循环指令:v-for 斗篷指令:v-cloak 2) ...
- js实现动态操作table
本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...
- nw.js如何处理拖放操作
nw.js如何处理拖放操作 其实拖放(drag-drop)操作是Html5的功能,不是nw.js的内置API,那么我们采用Html5应用一般的处理方法就可以了. 首先我们看一下一个正常的页面,直接拖放 ...
- Numeral.js – 格式化和操作数字的 JavaScript 库
Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...
- 【软件编程】乐易贵宾VIP教程 - JS改写+网页操作系列教程
JS改写系列教程: 1.MD5加密改写教程(爱拍网登录)2.解密如何快速找到真确的js加密算法3.多重MD5加密改写教程(5173登录)4.DZ论坛登录加密改写5.唯品会手机登录加密改写6.新浪微博密 ...
- JS实现 键盘操作
JS实现 键盘操作: 详情可以去其逛网查看其API并下载,地址:http://craig.is/killing/mice <!DOCTYPE html PUBLIC "-//W3C// ...
- js中如何操作json数据
一.要想熟练的操作json数据,就先要了解json数据的结构,json有两种结构:对象和数组. 1.对象 一个对象以“{”开始,“}”结束.每个“名称”后跟一个“:”:“‘名称/值’ 对”之间使用“, ...
- js数组的操作及数组与字符串的相互转化
数组与字符串的相互转化 <script type="text/javascript">var obj="new1abcdefg".replace(/ ...
随机推荐
- 关于Android项目隐藏标题栏的方法总结
1.在代码中添加这么一行代码 this.requestWindowFeature(Window.FEATURE_NO_TITLE); 注意:这段代码需要写在setContentView()之前,否则会 ...
- 自定义HTTP头时的注意事项(转)
原文:https://blog.gnuers.org/?p=462 HTTP头是可以包含英文字母([A-Za-z]).数字([0-9]).连接号(-)hyphens, 也可义是下划线(_).在使用ng ...
- Python并行编程(一):基本概念
1.线程和进程 进程是应用程序的一个执行实例,比如,在桌面上双击浏览器将会运行一个浏览器.线程是一个控制流程,可以在进程内与其他活跃的线程同时执行.控制流程指的是顺序执行一些机器指令.进程可以包含多个 ...
- Flask之视图函数
视图示例 @app.route('/hello') def hello(): return 'Hello World' if __name__ == '__main__': app.run() 特殊的 ...
- python 面向对象(进阶篇)转载武沛齐
上一篇<Python 面向对象(初级篇)>文章介绍了面向对象基本知识: 面向对象是一种编程方式,此编程方式的实现是基于对 类 和 对象 的使用 类 是一个模板,模板中包装了多个“函数”供使 ...
- 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 ...
- linux ipc/its
linux进程间双向消息队列 server.c #include <stdio.h> #include <stdlib.h> #include <string.h> ...
- Spark2.0 特征提取、转换、选择之二:特征选择、文本处理,以中文自然语言处理(情感分类)为例
特征选择 RFormula RFormula是一个很方便,也很强大的Feature选择(自由组合的)工具. 输入string 进行独热编码(见下面例子country) 输入数值型转换为double(见 ...
- django xadmin app models 注册
在app下新建adminx.py文件 # -*- coding: utf-8 -*- # 作者:神秘藏宝室 # 日期:2018/12/28 22:07 import xadmin from .mode ...
- 机器学习第7周-炼数成金-支持向量机SVM
支持向量机SVM 原创性(非组合)的具有明显直观几何意义的分类算法,具有较高的准确率源于Vapnik和Chervonenkis关于统计学习的早期工作(1971年),第一篇有关论文由Boser.Guyo ...