JavaScript 练手小技巧:JS 获取选中的文本或者禁止选择文本

有时候,我们需要获取鼠标选中的文本部分,可以利用 window 的 selection 对象做到。

利用 window.getSelection() 可以得到 window 的 selection 对象。

HTML 部分:

<div id="box">
    测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字
</div>

当选中文本的时候,最终鼠标会松开(mouseup)。所以,需要用到 mouseup 事件。

JavaScript 部分:

 let box = document.getElementById("box");

 box.addEventListener("mouseup",function(){
        let selectedText =  window.getSelection().toString();   // 把选中的内容转为字符串。
        if( selectedText.trim() !== ""){    // 去掉字符两边的空白
            console.info( selectedText );
        } 
});

当然,也可以禁止用户选择任何内容。

let box = document.getElementById("box");

box.addEventListener("mouseup",function(){
    window.getSelection().removeAllRanges();  // 去掉所有选中范围,也就是禁止选择内容
});

 

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值