使用ToggleButton切换按钮标签和功能

Question

以下是我正在处理的fiddle，我提到this example。

require(["dijit/form/ToggleButton", "dojo/domReady!"], function(ToggleButton){
    new ToggleButton({
        showLabel: true,
        checked: false,
        onChange: function(val){
            this.set('label',val);
            alert("function 1");
        },
        label: "Start"
    }, "programmatic");
});

在这里，我不明白传递val的位置。

1. 如何将标签切换为“开始”和“停止”？
2. 点击alert('function 1')按钮时如何Start     点击alert('function 2')时Stop？我计划有不同的功能。

Answer 1

如果选中/切换了togglebutton，则onChange事件处理程序返回一个布尔值。所以你可以像这样轻松写一个if：

onChange: function(val) {
    if (val) {
        this.set('label', 'Stop');
        alert('function 1');
    } else {
        this.set('label', 'Start');
        alert('function 2');
    }
}

如果你想在其他函数中分开，你可以每次覆盖onChange事件处理程序，但我认为如果你只是这样做会更容易：

onChange: function(val) {
    if (val) {
        this.function1();
    } else {
        this.function2();
    }
},
function1: function() {
    this.set('label', 'Stop');   
    alert("function1");
},
function2: function() {
    this.set('label', 'Start');
    alert("function2");
},

我还更新了您的JSFiddle。