04/29
2017
说到使用JavaScript选中文字,可能用得最多的场景是全选input输入框里面的文字,这个对input元素使用select()方法即可。
但是对于其他元素里的文字,select()方法无效,那么如何选中呢?浏览器中有Selection对象,我们可以通过Selection对象获取用户选择的区域,或者自动的去选择指定内容。
下面的代码是简单的示例,实现了选择某元素内的文本的功能。
function selectText(e) { if (document.selection) { //ie var range = document.body.createTextRange(); range.moveToElementText(e); range.select(); } else if (window.getSelection) { //chrome firefox var range = document.createRange(); range.selectNode(e); window.getSelection().removeAllRanges(); window.getSelection().addRange(range); } } selectText(document.querySelector("p"));
另外可在选择后使用document.execCommand来自动复制选择的内容:
document.execCommand('copy');
但要注意的是这个命令只能被用户手动操作来触发。
可参阅MDN文档