js中,将鼠标悬停在文字上,就可以将文字选中,这个效果如何制作?

image
如动图所示。
将鼠标悬停在文字上就可以选中文字,即一划就选中了,这个事件如果制作?
【注】不是用点击事件,全程不带点击的。只用鼠标划

阅读 3.5k
3 个回答

使用window.getSelection().toString()可以获取鼠标选用的内容
demo:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <p class="text">123</p>

  <script>
    window.onload = function() {
      document.querySelector('.text').addEventListener('click', SelectText, true)
      function SelectText() {
        var selecter = window.getSelection().toString()
        console.log(selecter)
      }
    }
  </script>
</body>
</html>

通过焦点获取光标所在元素你能看否满足需求
光标所在一般都在文本框里面(只适用于input,textarea)
以jq为例:

//光标所在input元素的位置
$("input:focus")
//光标所在textarea元素的位置
$("textarea:focus")

document.elementFromPoint 加 mousemove

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题