求教各位前辈一个通过按钮删除input内容的问题,具体需求是通过按钮去删除input内容。
有三种方式:
1、末尾删除:input不获得焦点的情况下,点击按钮从内容的最后一位开始删除每次删除一个字符
2、选中删除:input获得焦点,通过鼠标选中部分内容,点击按钮后,选中的内容被全部删除
3、插入删除:input获得焦点,将光标定位到input内容指定位置,点按钮后,从定位到的位置开始删除(假如input值是12345,光标定位到4,点按钮开始删除,需要的效果是5之前的部分点一次按钮删除一个,最后只剩5)
以上三点需求,我自己1和2已经实现,第三点遇到一个问题就是,光标定位后点按钮,只能删除定位位置的前一位,下来再点按钮,就直接从内容的末尾开始删除了。求教各位前辈指出问题的原因及用什么方法解决!!!谢谢
Document
删除选中内容
var test = document.getElementById('test');
var test_value = test.value;
var bttn_clear = document.getElementById('bttn_clear');
function getCursortPosition(ctrl) {//光标定位
var CaretPos = 0;
if (document.selection) {// IE Support
ctrl.focus();
var Sel = document.selection.createRange();
Sel.moveStart('character', -ctrl.value.length);
CaretPos = Sel.text.length;
}
// Firefox support
else if (ctrl.selectionStart || ctrl.selectionStart === '0')
CaretPos = ctrl.selectionStart;
return (CaretPos);
}
function select_range(type, str) {
str = type.value;
var start = type.selectionStart;
var end = type.selectionEnd;
var flg = end;
var str_arry = [];
str_arry = str.split("");
if (end > start) {//选中删除
str_arry.splice(start, end - start);
}
else {
if(start === end === 0){//末尾删除
str_arry.pop();
console.log(start);
console.log(end);
console.log(flg);
}
else {//定位删除
str_arry.splice(getCursortPosition(test)-1,1);
console.log(start);
console.log(end);
console.log(flg);
}
}
str = str_arry.join("");
type.value = str;
}
bttn_clear.onclick = function () {
test_value = select_range(test, test_value);
};
如果觉得《javascript 模拟退格键_js按钮模拟键盘退格键定位删除问题》对你有帮助,请点赞、收藏,并留下你的观点哦!