Question

您好我不熟悉如何暂停和恢复活动。我想暂停dijit / select的toggleDropDown方法并恢复它。我还有2个按钮，用于暂停和恢复并触发选择的下拉操作。我在道场读过article，但令我感到困惑。请参阅下面的我的脚本

<script>
        require([   "dojo/ready",
                    "dojo/_base/fx",
                    "dojo/on", 
                    "dojo/dom",
                    "dijit/TitlePane",
                    "dijit/form/Select",
                    "dojo/_base/window",
                    "dijit/form/Button",
                    "dojo/domReady!"
                ], function(ready, fx, on, dom, titlepane, select, win, Button) 
        {
                 ready(function()
                 {
                    var toggle = true;

                    var myButton = new Button
                    ({
                        label: "Toggle Select Events",
                        onClick: function()
                        {
                            if(toggle)
                            {
                                //true
                                selectTowns.pause();
                                toggle = false;
                            }
                            else
                            {
                                //false
                                selectTowns.resume();
                                toggle = true;
                            }

                        }
                     }, "progButtonNode");

                    var myButton1 = new Button
                    ({
                        label: "Trigger drop down",
                        onClick: function()
                        {
                            selectTowns.toggleDropDown();
                        }
                    }, 'dropButtonNode'); 

                    var selectTowns = new select
                    ({
                        name: "select2",
                        options: [
                        { label: "Tennessee", value: "Tennessee" },
                        { label: "Virginia", value: "Virginia", selected: true },
                        { label: "Washington", value: "Washington" },
                        { label: "Florida", value: "Florida" },
                        { label: "California", value: "California" }
                        ]
                    }).placeAt(win.body());

                    on.pausable(selectTowns, "click", clickHandle);

                 });
        });
    </script>

请指教谢谢克莱门特

Answer 1

on.pausable调用返回您需要的处理程序。您还必须将clickHandle定义为on.pausable方法中的函数，如下所示：

var selectHandler = on.pausable(selectTowns, "click", function(evt) {
    console.log("your handler code here");
});

该处理程序与pause（）和resume（）方法一起使用，而不是选择框：

if ( toggle ) {
    // true
    selectHandler.pause();
    toggle = false;
} else {
    // false
    selectHandler.resume();
    toggle = true;
}

所有人放在一起：

require([   
         "dojo/ready",
            "dojo/_base/fx",
            "dojo/on", 
            "dojo/dom",
            "dijit/TitlePane",
            "dijit/form/Select",
            "dojo/_base/window",
            "dijit/form/Button",
            "dojo/domReady!"
        ], 
        function(ready, fx, on, dom, titlepane, select, win, Button) 
        {
         ready(function()
         {
            var toggle = true;

            var myButton = new Button
            ({
                label: "Toggle Select Events",
                onClick: function()
                {
                    if(toggle)
                    {
                        //true
                        selectHandler.pause();
                        toggle = false;
                    }
                    else
                    {
                        //false
                        selectHandler.resume();
                        toggle = true;
                    }

                }
             }, "progButtonNode");

            var myButton1 = new Button
            ({
                label: "Trigger drop down",
                onClick: function()
                {
                    selectTowns.toggleDropDown();
                }
            }, 'dropButtonNode'); 

            var selectTowns = new select
            ({
                name: "select2",
                options: [
                { label: "Tennessee", value: "Tennessee" },
                { label: "Virginia", value: "Virginia", selected: true },
                { label: "Washington", value: "Washington" },
                { label: "Florida", value: "Florida" },
                { label: "California", value: "California" }
                ]
            }).placeAt(win.body());

            var selectHandler = on.pausable(selectTowns, "click", function(evt) {
                console.log("pausable click");
            });

         });
    });

Answer 2

如果我理解您正在尝试正确执行的操作，那么这就是您的代码应该是这样的：

require(["dojo/ready",
    "dojo/_base/fx",
    "dojo/on",
    "dojo/dom",
    "dijit/TitlePane",
    "dijit/form/Select",
    "dojo/_base/window",
    "dijit/form/Button",
    "dojo/domReady!"], function (ready, fx, on, dom, titlepane, select, win, Button) {
    ready(function () {
        var toggle = true;

        var myButton1 = new Button({
            label: "Trigger drop down"
        }, 'dropButtonNode');

        var selectTowns = new select({
            name: "select2",
            options: [{
                label: "Tennessee",
                value: "Tennessee"
            }, {
                label: "Virginia",
                value: "Virginia",
                selected: true
            }, {
                label: "Washington",
                value: "Washington"
            }, {
                label: "Florida",
                value: "Florida"
            }, {
                label: "California",
                value: "California"
            }]
        }).placeAt(win.body());

        var buttonHandler = on.pausable(myButton1, "click", function() {
            selectTowns.toggleDropDown();
        });

        var myButton = new Button({
            label: "Toggle Select Events",
            onClick: function () {
                if (toggle) {
                    //true
                    buttonHandler.pause();
                    toggle = false;
                } else {
                    //false
                    buttonHandler.resume();
                    toggle = true;
                }

            }
        }, "progButtonNode");

    });
});

或者查看我在这里制作的小提琴：http://jsfiddle.net/SxXAt/

我认为你错过的第一件事是“暂停”和“恢复”意味着dojo / on模块返回的处理程序（在我的例子中，它是buttonHandler）。返回的此处理程序是可以暂停或恢复的。

dojo / on：事件中的冲突

2 个答案: