Javascript Javascript中的选定文本事件触发器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3545018/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Selected text event trigger in Javascript
提问by Abhishek Tiwari
How to trigger a JavaScript function when someone selects a given text fragmenton a page using mouse?
Also, is there any way to find the position of selected texton the page?
当有人使用鼠标选择页面上的给定文本片段时，如何触发 JavaScript 函数？
另外，有没有办法找到页面上所选文本的位置？
Update: To be more clear, text fragment can be part of a sentence or a word or a phrase or whole a paragraph.
更新：为了更清楚，文本片段可以是句子、单词、短语或整个段落的一部分。
回答by jAndy
There is no "Text was selected" (DOM)event, but you can bind a mouseupevent to the document.body. Within that event handler, you might just check the
没有“选择文本”(DOM)事件，但您可以将mouseup事件绑定到document.body. 在该事件处理程序中，您可能只需检查
document.selection.createRange().text
or
或者
window.getSelection()
methods. There are several topics on Stackoverflow, like this one javascript to get paragraph of selected text in web page.
方法。Stackoverflow 上有几个主题，比如这个javascript 来获取网页中选定文本的段落。
I'm not sure what you mean with "finding the position", but to stay in my example world you could use the event propertysfor X+Y mouse positions.
我不确定“找到位置”是什么意思，但为了留在我的示例世界中，您可以使用event propertysfor X+Y 鼠标位置。
Example: http://www.jsfiddle.net/2C6fB/1/
回答by karim79
Here's a quick mashup:
这是一个快速的混搭：
$('div').mouseup(function() {
var text=getSelectedText();
if (text!='') alert(text);
});
function getSelectedText() {
if (window.getSelection) {
return window.getSelection().toString();
} else if (document.selection) {
return document.selection.createRange().text;
}
return '';
}?
<div>Here is some text</div>
回答by Ricky Han
There is a new experimental API that deals with this:
有一个新的实验性 API 可以解决这个问题：
The selectionchange event of the Selection API is fired when the selection object of the document is modified, or when the selection associated with an <input>or a <textarea>changes. The selectionchange event is fired at the document in the first case, on the element in the second case.
当文档的选择对象被修改时，或者与 an<input>或 a关联的选择<textarea>发生变化时，会触发 Selection API 的 selectionchange 事件。selectionchange 事件在第一种情况下在文档上触发，在第二种情况下在元素上触发。
https://developer.mozilla.org/en-US/docs/Web/Events/selectionchange
https://developer.mozilla.org/en-US/docs/Web/Events/selectionchange
Note that this is bleeding edge and not guaranteed to work across even major browsers.
请注意，这是最前沿的，并且不能保证即使在主要浏览器上也能正常工作。
回答by vikmalhotra
回答by Macist
There is "Text was selected" event. But only for textarea as I hava known.
有“文本被选择”事件。但仅适用于我所知道的 textarea。
<textarea onselect="message()" name="summary" cols="60" rows="5">
请写入个人简介，不少于200字！
</textarea>
回答by Mownesh
var selectedText = "";
if (window.getSelection) {
selectedText = window.getSelection();
}
if (document.getSelection) {
selectedText = document.getSelection();
}
if (document.selection) {
selectedText = document.selection.createRange().text;
}
function textSelector() {
alert(selectedText);
}
textSelector();
回答by ozd
I'm not sure about the mouse thing but this line works for mobile, this invoked every time a change made on the text selection -
我不确定鼠标的事情，但这条线适用于移动设备，每次对文本选择进行更改时都会调用 -
document.addEventListener('selectionchange', () => {
});
