Question

我正在尝试使用FirstPersonControls.js为移动创建一个3d环境，并为鼠标单击侦听器编写以下内容：

function onDocumentMouseDown(event) {

    event.preventDefault();

    var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1, 0.5);
    projector.unprojectVector(vector, camera);

    var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());

    var intersects = raycaster.intersectObjects(adblocks);

    if (intersects.length > 0) {

        intersects[0].object.material.color.setHex(Math.random() * 0xffffff);


    }
}

并在init（）中：

document.addEventListener('mousedown', onDocumentMouseDown, false);

我已经在另一个文档上完成了这个并且它工作正常，但是，这次我试图包含FirstPersonControls.js。

在FirstPersonControls.js中，我通过注释掉侦听器来禁用mousedown和mouseup侦听器，如下所示：

//this.domElement.addEventListener( 'mousedown', bind( this, this.onMouseDown ), false );
//this.domElement.addEventListener( 'mouseup', bind( this, this.onMouseUp ), false );

工作得很好。 FirstPersonControls.js本身工作正常。但是，当我为MouseDown事件添加额外的侦听器时，键输入（w，a，s，d，q，r和f）停止响应。如果我在页面加载时立即按下一个键，该键将一直有效，直到我停止，然后一切都停止响应。另外，我不明白的另一件事，这可能是相关的，这就是为什么我提到它，如果我在FirstPersonControls.js中注释掉这一行：

this.domElement.addEventListener( 'mousemove', bind( this, this.onMouseMove ), false );

没有任何改变。一切都保持完全相同，这对我来说没有意义，因为我认为这是将鼠标移动事件绑定到文档的位置。

Answer 1

FirstPersonControl.js脚本为mousedown事件添加了一个侦听器函数。你的代码也是如此。当mousedown事件发生时，首先调用最后一个事件处理程序，通常，之后应调用其他事件处理程序。但是，这个：

event.preventDefault();

阻止事件冒泡到其他事件处理程序。我相信删除这一行应足以解决您所描述的问题。

为什么在添加另一个事件侦听器时，FirstPersonControls.js会停止运行？

1 个答案: