光标位置后插入
其实光标位置后插入，我的做法是很简单的，就一句话。vue版本如下：
[AppleScript] 纯文本查看 复制代码
?
1
2
3
4
let focusinput = this.inputEl.selectionStart
if (this.nowSelect) {
item.subsText = `${item.subsText.substr(0, focusinput)}${this.nowLabel}${item.subsText.substring(focusinput, item.subsText.length)}`
}
其中this.inputEl就是input元素
item.subsText就是input中文本
this.nowLabel就是要插入的内容
插入就一句话判断0到selectionStart的位置，然后把文本查到后面就可以了。
封装方法
网上也有一些封装的方法，看了一下，大致可以用。如下：
获取光标位置函数
[AppleScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
// 获取光标位置
function getCursortPosition (textDom) {
var cursorPos = 0;
if (document.selection) {
// IE Support
textDom.focus ();
var selectRange = document.selection.createRange();
selectRange.moveStart ('character', -textDom.value.length);
cursorPos = selectRange.text.length;
}else if (textDom.selectionStart || textDom.selectionStart == '0') {
// Firefox support
cursorPos = textDom.selectionStart;
}
return cursorPos;
}
设置光标位置函数：
[AppleScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
// 设置光标位置
function setCaretPosition(textDom, pos){
if(textDom.setSelectionRange) {
// IE Support
textDom.focus();
textDom.setSelectionRange(pos, pos);
}else if (textDom.createTextRange) {
// Firefox support
var range = textDom.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
}
获取光标选中文字函数：
[AppleScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
// 获取选中文字
function getSelectText() {
var userSelection, text;
if (window.getSelection) {
// Firefox support
userSelection = window.getSelection();
} else if (document.selection) {
// IE Support
userSelection = document.selection.createRange();
}
if (!(text = userSelection.text)) {
text = userSelection;
}
return text;
}
选中特定范围的文本函数：
[AppleScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
/**
* 选中特定范围的文本
* 参数：
* textDom [JavaScript DOM String] 当前对象
* startPos [Int] 起始位置
* endPos [Int] 终点位置
*/
function setSelectText(textDom, startPos, endPos) {
var startPos = parseInt(startPos),
endPos = parseInt(endPos),
textLength = textDom.value.length;
if(textLength){
if(!startPos){
startPos = 0;
}
if(!endPos){
endPos = textLength;
}
if(startPos > textLength){
startPos = textLength;
}
if(endPos > textLength){
endPos = textLength;
}
if(startPos < 0){
startPos = textLength + startPos;
}
if(endPos < 0){
endPos = textLength + endPos;
}
if(textDom.createTextRange){
// IE Support
var range = textDom.createTextRange();
range.moveStart("character",-textLength);
range.moveEnd("character",-textLength);
range.moveStart("character", startPos);
range.moveEnd("character",endPos);
range.select();
}else{
// Firefox support
textDom.setSelectionRange(startPos, endPos);
textDom.focus();
}
}
}
在光标后插入文本函数：
[AppleScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
/**
* 在光标后插入文本
* 参数：
* textDom [JavaScript DOM String] 当前对象
* value [String] 要插入的文本
*/
function insertAfterText(textDom, value) {
var selectRange;
if (document.selection) {
// IE Support
textDom.focus();
selectRange = document.selection.createRange();
selectRange.text = value;
textDom.focus();
}else if (textDom.selectionStart || textDom.selectionStart == '0') {
// Firefox support
var startPos = textDom.selectionStart;
var endPos = textDom.selectionEnd;
var scrollTop = textDom.scrollTop;
textDom.value = textDom.value.substring(0, startPos) + value + textDom.value.substring(endPos, textDom.value.length);
textDom.focus();
textDom.selectionStart = startPos + value.length;
textDom.selectionEnd = startPos + value.length;
textDom.scrollTop = scrollTop;
}
else {
textDom.value += value;
textDom.focus();
}
}
复制和剪切板
监听页面复制，添加一些版权信息，代码如下：
[AppleScript] 纯文本查看 复制代码
?
1
2
3
4
5
6
7
8
document.addEventListener('copy', function (event) {[/font][/backcolor][/color][/align] var clipboardData = event.clipboardData || window.clipboardData;
if (!clipboardData) { return; }
var text = window.getSelection().toString();
if (text) {
event.preventDefault();
clipboardData.setData('text/plain', text + '\n\n haorooms博客版权所有');
}
})
