[英]Drop down menu not work
我正在开发一个简单的Web应用程序,我正在使用两个js库:dat.gui和three.js。
我的问题是下拉菜单被锁定。 我无法打开它。
// gui initialization (dat.gui)
function initGui() {
var Options = function() {
this.tenda = 'bar';
};
config = new Options();
var gui = new dat.GUI();
var subGui = gui.addFolder('Setting');
subGui.open();
// callbacks
subGui.add( config, 'tenda', ['bar', 'pie', 'area']).
onChange(
function() {
if (config.tenda === 'bar') { ... }
else if (config.tenda === 'pie') { ... }
else if (config.tenda === 'area') { ... }
}
);
};
在网上阅读,这似乎是一个已知问题,但在某些例子中,我看到下拉菜单运行良好。 我是js的新手,我想“也许有一些范围问题”,所以我将初始化过程放在一个完成工作的函数中。 但问题仍然存在。
我正在研究Ubuntu / Chrome和Ubuntu / Firefox。 你可以在这里检查整个代码,我使用复选框而不是下拉菜单。
我面临同样的问题。 在我的代码中,我改变了:
var controls = new THREE.OrbitControls(camera);
至
var controls = new THREE.OrbitControls(camera, renderer.domElement);
我面临同样的问题。 在我的代码中,我听了鼠标点击事件。 和那样的回调函数:
function onDocumentMouseDown( event ) {
event.preventDefault();
... //other code
}
我发现问题是“event.preventDefault();”,这会阻止点击下拉列表,所以通过评论它,我的问题就解决了。 您还可以检查与鼠标单击事件相关的其他功能。
确保preventDefault仅从绘图画布中调用mouseEvent解决了我的问题(在Three.js的上下文中,使用OrbitControls和raycaster在mouseclick上选择)
function onDocumentMouseDown(event) {
// https://stackoverflow.com/a/11562933/1497139
var target = event.target || event.srcElement;
var tag = target.tagName;
if (tag!='CANVAS')
return;
event.preventDefault();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.