一,替换输入框选中的值
<input onselect="textSelect(this)" id="aaa" type="text" />
<button type="button" onclick="replaceText()">11111</button>
方式一
var currentSelection={};
//记录选中的信息,不支持IE
function textSelect(obj){
currentSelection.ele = obj;
var start = currentSelection.start = obj.selectionStart;//从0开始
var end = currentSelection.end = obj.selectionEnd;
var text = currentSelection.text= obj.value.slice(start,end);
}
function textSelect1(obj){
currentSelection.ele = obj;
var text = window.getSelection();
var start = currentSelection.start = obj.selectionStart;
}
function replaceText(){
if(!currentSelection.ele) return;
var val = currentSelection.ele.value;
var reg = new RegExp("(?<=^.{"+currentSelection.start+"})"+currentSelection.text)
currentSelection.ele.value = val.replace(reg,"大魔王");
currentSelection = {};
}
方式二
<script src="https://cdn.bootcdn.net/ajax/libs/jquery.selection/1.0.1/jquery.selection.js"></script>
function textSelect(element){
var pos = $(element).selection("getPos");
selectCaret = {src:$(element), start: pos.start, end: pos.end};
}
var selectCaret;
function _selectTxt(){
return selectCaret.src.val().substring(selectCaret.start,selectCaret.end);
}
function _replaceCaret(txt){
var pre = selectCaret.src.val().substring(0,selectCaret.start);
var last = selectCaret.src.val().substring(selectCaret.end);
selectCaret.src.val(pre+txt+last);
}
function replaceText(){
replaceCaret("大魔王")
}
二,替换文本选中的值
//不支持IE
function replaceText(){
var select = window.getSelection();
if(!select) return;
var range = select.getRangeAt(0);
var a = document.createElement("b");
a.style.color="red";
range.surroundContents(a);//修饰选中的值,加粗并设置为红色
a.innerHTML="11111";//替换选中的值
}