请问如何使用JavaScript获取光标下的单词?

如何使用JavaScript获取光标下的单词?

如果我有

<p> some long text </p>

在我的HTML页面上,我如何知道鼠标的光标就在‘text’这个词的上方?


富国沪深
浏览 311回答 3
3回答

森林海

我的另一个答案只适用于Firefox。这个答案适用于Chrome。(我不知道火狐也能用。)function&nbsp;getWordAtPoint(elem,&nbsp;x,&nbsp;y)&nbsp;{ &nbsp;&nbsp;if(elem.nodeType&nbsp;==&nbsp;elem.TEXT_NODE)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;range&nbsp;=&nbsp;elem.ownerDocument.createRange(); &nbsp;&nbsp;&nbsp;&nbsp;range.selectNodeContents(elem); &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;currentPos&nbsp;=&nbsp;0; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;endPos&nbsp;=&nbsp;range.endOffset; &nbsp;&nbsp;&nbsp;&nbsp;while(currentPos+1&nbsp;<&nbsp;endPos)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.setStart(elem,&nbsp;currentPos); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.setEnd(elem,&nbsp;currentPos+1); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(range.getBoundingClientRect().left&nbsp;<=&nbsp;x&nbsp;&&&nbsp;range.getBoundingClientRect().right&nbsp;&nbsp;>=&nbsp;x&nbsp;&& &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.getBoundingClientRect().top&nbsp;&nbsp;<=&nbsp;y&nbsp;&&&nbsp;range.getBoundingClientRect().bottom&nbsp;>=&nbsp;y)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.expand("word"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;ret&nbsp;=&nbsp;range.toString(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.detach(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return(ret); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;currentPos&nbsp;+=&nbsp;1; &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;for(var&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;<&nbsp;elem.childNodes.length;&nbsp;i++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;range&nbsp;=&nbsp;elem.childNodes[i].ownerDocument.createRange(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.selectNodeContents(elem.childNodes[i]); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(range.getBoundingClientRect().left&nbsp;<=&nbsp;x&nbsp;&&&nbsp;range.getBoundingClientRect().right&nbsp;&nbsp;>=&nbsp;x&nbsp;&& &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.getBoundingClientRect().top&nbsp;&nbsp;<=&nbsp;y&nbsp;&&&nbsp;range.getBoundingClientRect().bottom&nbsp;>=&nbsp;y)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.detach(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return(getWordAtPoint(elem.childNodes[i],&nbsp;x,&nbsp;y)); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;range.detach(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;} &nbsp;&nbsp;return(null);}在你的Mousemove处理程序中,打电话getWordAtPoint(e.target, e.x, e.y);
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript