在Javascript中select文本事件触发器
这听起来可能是一个新手问题,但我想知道如何在用户使用鼠标在页面上select给定文本片段时触发自定义JavaScript函数。 还有什么方法可以find在网页上选定的文字的位置?
更新:为了更加清楚,文本片段可以是句子或单词或短语或整个段落的一部分。
没有“ 文本被选中 ” (DOM)
事件,但是您可以将mouseup
事件绑定到document.body
。 在那个事件处理程序中,你可能只是检查一下
document.selection.createRange().text
要么
window.getSelection()
方法。 在Stackoverflow上有几个主题,就像这个javascript来获取网页中选定文本的段落 。
我不确定你的意思是“find位置”,但留在我的例子世界中,你可以使用event propertys
的X + Y鼠标位置。
例如: http : //www.jsfiddle.net/2C6fB/1/
这是一个快速混搭:
$('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>
演示: http : //jsfiddle.net/FvnPS/11/
有一个新的实验性API可以处理这个问题:
selectAPI的selectionchange事件在文档的select对象被修改时,或者与<input>
或<textarea>
关联的select改变时被触发。 selectionchange事件在第一种情况下是在第二种情况下的元素上触发的。
https://developer.mozilla.org/en-US/docs/Web/Events/selectionchange
请注意,这是前卫,并不能保证即使在主stream浏览器上也能正常工作。
AFAIK,你没有描述过这样的事件。 但是你可以模拟这个function。
看看这里的代码和演示。
有“文字被选中”事件。 但只为我所知的textarea。
<textarea onselect="message()" name="summary" cols="60" rows="5">请写入个人简介,不less于200字! </textarea>
使用下面的代码:
(function () { "use strict"; var showSelectedText = function (e) { var text = ''; if (window.getSelection) { text = window.getSelection(); } else if (document.getSelection) { text = document.getSelection(); } else if (document.selection) { text = document.selection.createRange().text; } console.log(text.toString()); } document.onmouseup = showSelectedText; if (!document.all) { document.captureEvents(Event.MOUSEUP); } })();
这是我在我的一个任务中使用的示例代码。 它为我工作。