搜索

首页  >  问答  >  正文

如何用javascript实现高亮选中的文本

如何用javascript实现高亮选中的文本

我的提问似乎不太清晰。。就像“https://dev.vijos.org/problems/P1006”,选中描述部分的文本,会出现一个浮动的小框,可以选择颜色使得选中的文本高亮

巴扎黑巴扎黑2894 天前651

全部回复(1)我来回复

  • PHPz

    PHPz2017-04-10 12:45:52

    <span onmouseover="this.style.background='red'">哈哈哈</span>
    <span onmouseover="this.style.background='yellow'">嘎嘎嘎</span>
    <span onmouseover="this.style.background='green'">哇哇哇</span>

    你早说啊!

    首先你要全局监听ONMOUSEUP事件,好弹出那个小泡泡,对吧,这个很简单就不说了,
    剩下的就是获得选中的部分,
    例如这句话“南方周末”,你选中了“方周”
    浏览器里面有个方法
    var a = window.getSelection();
    这个方法你可以获得一个对象,你面包含了你当前所选中的对象的一些信息。
    然后 a.getRangeAt(); 之后你会获得选中的信息,
    var b = a.getRangeAt();
    其中有两个字段,即
    b.endOffset(此时等于3)
    b.startOffset(此时等于1)
    这两个值代表着“方周”在“南方周末”的起始和结束位置,剩下就简单了。

    回复
    0
  • 取消回复