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;
});

以前に使用していたブールトグルコードは、3つ以上の選択にうまく一般化されませんでした。また、このバージョンのコードでは、常に1つのチェックボックスが選択されているだけで、選択がゼロになる可能性はありません。

于 2012-08-06T19:03:18.353 に答える