注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

云淡风轻

云淡风轻近午天,傍花随柳过前川。

 
 
 

日志

 
 

Selection in Browsers  

2009-03-08 00:32:00|  分类: 格物致知 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

选中一些文件的操作非常简单:在页面上按下左键,拖动鼠标,松开左键。

  不过要用javascript来操作的话,就相对比较麻烦一点点。

  先从简单的开始:textarea的selection。

基本上要用到的操作是:

  • 取得selection中的文字
  • 得到selection的信息:开始位置,结束位置等

  • 设置selection的内容
  • 设置某些内容被选中
  • 变化selection的范围

    var ta = document.getElementsByTagName('textarea')[0];

前端开发总是在和浏览器兼容打交道的。

首先是Firefox:只需要用到 textarea 元素的两个属性:selectionStart 和 selectionEnd

      ta.value.substring( ta.selectionStart, ta.selectionEnd );    // selection中的文件

      ta.value = ta.value.substr(0, ta.selectionStart) + 'abc' + ta.value.substr(0, ta.selectionEnd) // 设置selection中内容为"abc"

      ta.selectionStart = 3;

      ta.selectionEnd = 10;      // 选中第10个字符到第10个字符

但是要注意的是:selectionStart 的值一定要小于 selectionEnd。如果大于的话,两个的值就变成一样,具体的值取决于哪个慢设置。

测了一下chrome,也一样。估计safari, opera也可以的。

接下来是IE:

    s = document.selection

    r = s.createRange()

    r.text           // selection中的文件

    r.moveStart('character', -3);      // selection 的开始部分向左移动三个字符

    r.moveEnd('character', 3);      // selection 的结束部分向右移动三个字符

  评论这张
 
阅读(102)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017