无法使用 OrbitControls 选择文本？

Posted 2023-02-27

【中文标题】无法使用 OrbitControls 选择文本？

【英文标题】：Cannot select text with OrbitControls?

【发布时间】：2014-03-10 04:38:04

【问题描述】：

我正在使用 OrbitControls.js 制作 Three.js 项目，但我意识到我无法使用 OrbitControls 选择（突出显示）任何文本。

这里是示例链接：http://threejs.org/examples/#misc_controls_orbit （尝试在示例顶部选择文本“轨道控制示例”，我们不能这样做）

那么，如何使用 OrbitControl 选择（突出显示）文本？

（或者我每次想要复制文本时都必须禁用控制？）

谢谢。

【问题讨论】：

不清楚你在问什么。您要选择什么文本？

嗨，我编辑了，我希望用户可以选择和复制我项目中的任何文本

你的意思是 html-text 还是任何 html 文本或者你在说什么？场景中的 3D 文本几何？

【参考方案1】：

默认情况下，OrbitControls 侦听document 上的鼠标事件，这就是为什么您不能在同一页面中将鼠标用于其他目的，例如选择文本或打开上下文菜单。您可以通过将 DOM 节点指定为构造函数 THREE.OrbitControls 的第二个参数来更改此行为。然后OrbitControls 监听这个DOM 节点上的鼠标事件，而不是整个document。

如果你有类似的代码

var renderer = …;
container.appendChild(renderer.domElement);
…
var controls = new THREE.OrbitControls(camera);

然后将最后一行替换为

var controls = new THREE.OrbitControls(camera, renderer.domElement);

the example you mentioned的情况下，可以移动controls的初始化：

controls = new THREE.OrbitControls( camera );
controls.addEventListener( 'change', render );

在renderer初始化之后，将renderer.domElement作为第二个参数添加到构造函数THREE.OrbitControls中。现在您可以选择页面上的文本了。

【讨论】：

我爱你！！让我的一天如此充实

你进来，关上一关，把它拿下来。这就是老手的编码方式。干得好伙伴！

【参考方案2】：

创建输入：

var identidad = document.createElement( 'INPUT' );

通过将焦点赋予该元素来扩展点击事件：

identidad.addEventListener( 'click', function ( event ) 
    $(this).focus();
);