|
@@ -134,17 +134,27 @@ class EditableSpan extends Component{
|
|
|
$(this.$span.current).off("paste");
|
|
|
}
|
|
|
|
|
|
- moveEnd(obj) {
|
|
|
+ moveEnd(obj,flg) {
|
|
|
if(window.getSelection){//ie11 10 9 ff safari
|
|
|
- obj.focus(); //解决ff不获取焦点无法定位问题
|
|
|
- var range = window.getSelection();//创建range
|
|
|
- range.selectAllChildren(obj);//range 选择obj下所有子内容
|
|
|
- range.collapseToEnd();//光标移至最后
|
|
|
+ setTimeout(() => {
|
|
|
+ obj.focus(); //解决ff不获取焦点无法定位问题
|
|
|
+ var range = window.getSelection();//创建range
|
|
|
+ range.selectAllChildren(obj);//range 选择obj下所有子内容
|
|
|
+ if(flg){
|
|
|
+ range.collapseToStart();//光标移至最后
|
|
|
+ }else{
|
|
|
+ range.collapseToEnd();//光标移至最后
|
|
|
+ }
|
|
|
+ }, 0);
|
|
|
}
|
|
|
else if (document.selection) {//ie10 9 8 7 6 5
|
|
|
var range = document.selection.createRange();//创建选择对象
|
|
|
range.moveToElementText(obj);//range定位到obj
|
|
|
- range.collapse(false);//光标移至最后
|
|
|
+ if(flg){
|
|
|
+ range.collapse(true);//光标移至最后
|
|
|
+ }else{
|
|
|
+ range.collapse(false);//光标移至最后
|
|
|
+ }
|
|
|
range.select();
|
|
|
}
|
|
|
}
|
|
@@ -165,6 +175,18 @@ class EditableSpan extends Component{
|
|
|
}
|
|
|
let range = window.getSelection();
|
|
|
let textIndex = range.focusOffset;
|
|
|
+
|
|
|
+
|
|
|
+ let preObj = $(this.$span.current).prev();
|
|
|
+ let nexObj = $(this.$span.current).next();
|
|
|
+ if(preObj &&preObj[0] && preObj[0].nodeName !="DIV"&&textIndex == 0&&innerVal.length>0&&ev.keyCode==8){//在span的第一位
|
|
|
+ let obj = preObj[0]&&preObj[0].nodeName=="DIV"?preObj.prev():preObj;
|
|
|
+ this.moveEnd(obj[0]);
|
|
|
+ }else if(nexObj &&nexObj[0] && nexObj[0].nodeName !="DIV"&&textIndex == innerVal.length&&innerVal.length>0&&ev.keyCode==46){//最后一位
|
|
|
+ let obj = nexObj[0]&&nexObj[0].nodeName=="DIV"?nexObj.next():nexObj;
|
|
|
+ this.moveEnd(obj[0],true);
|
|
|
+ }
|
|
|
+
|
|
|
let textLength = range.anchorNode.length;
|
|
|
if(ev.keyCode==37&& i!=0){//向左
|
|
|
let preObj = $(this.$span.current).prev();
|
|
@@ -190,10 +212,12 @@ class EditableSpan extends Component{
|
|
|
ev.returnValue=false;
|
|
|
}
|
|
|
if(obj){
|
|
|
- obj.focus();
|
|
|
+ // obj.focus();
|
|
|
+ this.moveEnd(obj[0],1)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
}
|
|
|
handleKeyup(e){
|
|
|
const {boxMark,handleKeydown,removeId,handleClear,removeSpan} = this.props;
|
|
@@ -208,28 +232,48 @@ class EditableSpan extends Component{
|
|
|
if(ev.keyCode==46){//delete
|
|
|
//判断nexObj
|
|
|
// let nextObj = $(this.$span.current).next();
|
|
|
+ // ||textIndex ==innerVal.length&&preObj[0].nodeName=="DIV"
|
|
|
+ let range = window.getSelection();
|
|
|
+ let textIndex = range.focusOffset;
|
|
|
let nextObj = $(this.$span.current);
|
|
|
+ let nexObj = $(this.$span.current).next();
|
|
|
+ let neObj = $(this.$span.current).next().next();
|
|
|
+ let preObj = $(this.$span.current).prev();
|
|
|
if(preVal.trim().length==1&& !innerVal){
|
|
|
removeId && removeId({boxMark,i:index,text:"",flag:'del'});
|
|
|
handleClear && handleClear({boxMark});//删除最后一个字时清空搜索结果,避免现病史搜索框不立即消失的情况
|
|
|
//如果后一个不是标签,则光标移到最前
|
|
|
if(nextObj && nextObj[0].nodeName !=="DIV"){
|
|
|
- nextObj.focus();
|
|
|
+ // nextObj.focus();
|
|
|
+ this.moveEnd(nextObj[0],1)
|
|
|
+ }else{
|
|
|
+ this.moveEnd(preObj[0])
|
|
|
}
|
|
|
}
|
|
|
//action里往后删除
|
|
|
if(innerVal == preVal){
|
|
|
let data = innerVal.trim();
|
|
|
if(nextObj && !config.punctuationReg.test(data) || data=='<br>'){
|
|
|
+ // console.log(nextObj,nexObj,neObj)
|
|
|
+ // nextObj.focus();
|
|
|
+ console.log(9)
|
|
|
handleKeydown&&handleKeydown({boxMark,i:index,text:data,flag:'del'});
|
|
|
- // nextObj.focus();
|
|
|
if(nextObj && nextObj[0] && nextObj[0].nodeName !=="DIV"){
|
|
|
// IE浏览器focus光标在最后,其他浏览器在最前
|
|
|
- nextObj.focus();
|
|
|
+ // nextObj.focus();
|
|
|
+ this.moveEnd(nextObj[0]);
|
|
|
}
|
|
|
/*this.setState({
|
|
|
index: null
|
|
|
})*/
|
|
|
+ }else if(textIndex ==innerVal.length&&nexObj[0]&&nexObj[0].nodeName=="DIV"){
|
|
|
+ console.log(99)
|
|
|
+ handleKeydown&&handleKeydown({boxMark,i:index+1,text:data,flag:'del'});
|
|
|
+ this.moveEnd(nextObj[0]);
|
|
|
+ }else if(nexObj[0].nodeName=="SPAN"){
|
|
|
+ console.log(999)
|
|
|
+ handleKeydown&&handleKeydown({boxMark,i:index,text:'',flag:'del'});
|
|
|
+ this.moveEnd(nextObj[0]);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -246,6 +290,8 @@ class EditableSpan extends Component{
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ let range = window.getSelection();
|
|
|
+ let textIndex = range.focusOffset;
|
|
|
if(innerVal !== preVal){
|
|
|
|
|
|
}else{
|
|
@@ -264,7 +310,7 @@ class EditableSpan extends Component{
|
|
|
// let pattern = new RegExp(/^\,?$|^\,?$|^\.?$|^\。?$|^\、?$|^\;?$|^\;?$|^\:?$|^\:?$|\s/);
|
|
|
// if(index!==0 && pattern.test(data)){
|
|
|
// 后半段是处理IE
|
|
|
- if(index!==0 && !config.punctuationReg.test(data) || index!==0 && data=='<br>'){
|
|
|
+ if(index!==0 && !config.punctuationReg.test(data) || index!==0 && data=='<br>'||textIndex ==0&&preObj[0]&&preObj[0].nodeName=="DIV"){
|
|
|
// let preObj = $(this.$span.current).prev();
|
|
|
let obj = preObj[0].nodeName=="DIV"?preObj.prev():preObj;
|
|
|
handleKeydown&&handleKeydown({boxMark,i:index,text:data,flag:'backsp'});
|