码迷,mamicode.com
首页 > 编程语言 > 详细

javascript 获取光标所选中的内容并插入到另一个文本框中(兼容ie和ff)

时间:2014-06-11 21:49:24      阅读:291      评论:0      收藏:0      [点我收藏+]

标签:style   java   tar   ext   color   com   

项目中正好用到 做下笔记方便以后查找

ie获取光标的位置使用document.selection.createRange()

火狐下使用document.getElementById(id).selectionStart 和 document.getElementById(id).selectionEnd

假设我们要获得id为txt的Textarea元素里面光标所选择的内容

首先创建一个获得光标所选内容的函数(参数:火狐下需要Dom元素 select_field=document.getElementById(txt))

var word="";

function getFieldSelection(select_field) {
     if (document.selection) {//这里判断是否是ie浏览器
     var sel = document.selection.createRange();//document.selection.createRange() 根据当前文字选择返回 TextRange 对象,或根据控件选择返回 ControlRange 对象。配合 execCommand,在 HTML 编辑器中很有用,比如:文字加粗、斜体、复制、粘贴、创建超链接等
            if (sel.text.length > 0) {// document.selection.createRange().text就是获取文本域里选中的一段文字,大于0判断是否有选中
            word = sel.text;
            }
     }
    else if (select_field.selectionStart || select_field.selectionStart == ‘0‘) {//这里判断浏览器是否是火狐
          var startP = select_field.selectionStart;//获得光标选中内容的开始位置
          var endP = select_field.selectionEnd;//获得光标选中内容的结束位置
          if (startP != endP) {//判断是否选中了 如果位置一样 说明没有选中
          word = select_field.value.substring(startP, endP);//用substring截取选中的内容
          }
     }
}

上述就可以拿到选中的内容了

接下来我们把选中的内容插入到另一个文本框中

$("#txtMoudler").click(function () {
     var select_field = $(this)[0];
     var content =word;
     if (content != "") {
         if (document.selection) {//ie6
         var sel = document.selection.createRange(); //获取ie光标位置
             if (document.selection.type != "None") {
              sel.text = content;
              sel.select();//光标设置到添加内容的后面
             }
        }
         else if (select_field.selectionStart || select_field.selectionStart == ‘0‘) {//这里判断浏览器是否是火狐
             var start = select_field.selectionStart; //获取光标焦点前坐标
             var end = select_field.selectionEnd; //获取光标焦点后坐标

             //重新写入文本框中的内容
             select_field.value = select_field.value.substring(0, start) + content + select_field.value.substring(end, select_field.value.length);
             var lengths = select_field.value.substring(0, Number(start)).length + content.length;
             select_field.setSelectionRange(lengths, lengths);//光标设置到添加内容的后面
             $(this).focus();
             }
      }

});

javascript 获取光标所选中的内容并插入到另一个文本框中(兼容ie和ff),布布扣,bubuko.com

javascript 获取光标所选中的内容并插入到另一个文本框中(兼容ie和ff)

标签:style   java   tar   ext   color   com   

原文地址:http://www.cnblogs.com/-alex/p/3772471.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!