功夫码

解决safari浏览器的contenteditable元素的不显示光标

晓峰 时间:2019-05-18 22:24:15 阅读:152
--------------------------------------------------------- Ta 只分享的内容开始 ---------------------------------------------------------------------

解决safari浏览器的contenteditable元素的不显示光标


1 看看元素的宽度够不够,如果是span不要忘了设置这个。

span{
	display: inline-block;
	min-width: 1px;
}


2 设置一下这个试试 加一个style:  -webkit-user-select:auto;

<div class="div" contenteditable="true"  style="-webkit-user-select:auto" />


3 方案3

function keepLastIndex(obj) {    
    if (window.getSelection) {
    //ie11 10 9 ff safari
        obj.focus(); //解决ff不获取焦点无法定位问题
        var range = window.getSelection();//创建range
        range.selectAllChildren(obj);//range 选择obj下所有子内容
        range.collapseToEnd();//光标移至最后
    }  else if (document.selection) {//ie10 9 8 7 6 5
        var range = document.selection.createRange();//创建选择对象
        //var range = document.body.createTextRange();
        range.moveToElementText(obj);//range定位到obj
        range.collapse(false);//光标移至最后
        range.select();
    }
}


4 方案4

function setFocus(that){
	if(document.all){
		that.range=document.selection.createRange();
		that.range.select();
		that.range.moveStart("character",-1); 
	}else{
		that.range=window.getSelection().getRangeAt(0);
		that.range.setStart(that.range.startContainer,2);
	}
}


--------------------------------------------------------- Ta 只分享了这些内容 ---------------------------------------------------------------------

本文来源:功夫码(gongfuma.com)
声明:本文系功夫码原创稿件,版权属[功夫码 gongfuma.com]所有。
未经授权不得转载,已经协议授权的媒体下载使用时须注明"稿件来源:功夫码",违者将依法追究责任。

相关文章

  • 回到顶部