1

我想知道如何使用 dat.GUI.js 创建互斥复选框。API 链接：http ://workshop.chromeexperiments.com/examples/gui/#1--Basic-Usage 。

我创建了一个 jsfiddle [ http://jsfiddle.net/georgeneil/dEbRg/ ] 来实现互斥复选框。但它有一些问题。

第 1 步：当我单击 CheckBox2 时，它按预期工作。

第 2 步：当我单击 CheckBox1 时，它没有被选中。

有人可以指导我如何修复它或提供一个链接，我可以在其中获得有关 dat.GUI.js 问题的答案

4

1 回答 1

2

尝试更改 jsFiddle 中的代码，如下所示：

// dat.gui controls
var view = this;
view.CheckBox1 = true;
view.CheckBox2 = false;


var gui = new dat.GUI();
var CB1Controller = gui.add(view, 'CheckBox1').listen();
CB1Controller.onChange(function(value){
        view.CheckBox1 = true;
        view.CheckBox2 = false;
});

var CB2Controller = gui.add(view, 'CheckBox2').listen();
CB2Controller.onChange(function(value){
        view.CheckBox1 = false;
        view.CheckBox2 = true;
});

您之前使用的布尔切换代码不能很好地推广到两个以上的选择。此外，此版本的代码将始终强制选择一个复选框——零选择是不可能的。

于 2012-08-06T19:03:18.353 回答