IE中textarea光标丢失问题及解决方法

首先,让我对IE浏览器致以最热烈的问候:我次奥~

当页面上内嵌了iframe,同时此iframe中还内嵌了iframe,弹出窗口后,原来textarea中编辑的光标位置就会丢失。在chorme和firefox下不会出现此问题。

解决方法:在textarea的mouse和key事件中保存当前光标位置,然后在窗口关闭时还原。

1.保存光标位置

<textarea name="tbintro" rows="2" cols="20" id="tbintro" οnmοuseup="saverange(this);" onKeyUp="saverange(this);“>
var ieSelectionBookmark;
function saverange(obj)
{
    var range = document.selection.createRange();   
    ieSelectionBookmark = range.getBookmark();
}

2.还原

    if(ieSelectionBookmark){
        var range = document.selection.createRange();
        range.moveToBookmark(ieSelectionBookmark);
        range.select();
        ieSelectionBookmark = null;
    }

你以为这样就完了么?。。。更坑爹的是,测试发现,光标在文本中时能正常复位,但是如果在结尾,则还原后光标跑到textarea开头了。

原因一直没找到,只能用一个比较笨的方法来解决:在保存光标时同时记录是不是在结尾。然后在关闭窗口时根据这个记录来做相应处理。

var isEnd;
var ieSelectionBookmark;
function saverange(obj)
{
    var range = document.selection.createRange();   
    ieSelectionBookmark = range.getBookmark();
    getCaretPos(obj);
}

function getCaretPos(obj){ 
    obj.focus();
    var allRange = document.body.createTextRange();
    allRange.moveToElementText(obj);
    
    var workRange = document.selection.createRange();
    workRange.setEndPoint("StartToStart",allRange); 
    
    len=workRange.text.length; 
    if (len >= obj.value.length) 
        isEnd = true;
    else
        isEnd = false;
} 



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值