Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/375.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
在JavaScript类中添加回调功能_Javascript_Jquery_Jquery Plugins - Fatal编程技术网

在JavaScript类中添加回调功能

在JavaScript类中添加回调功能,javascript,jquery,jquery-plugins,Javascript,Jquery,Jquery Plugins,我试图创建一个javascript类,它打开一个jQuery对话框,允许用户选择一个选项,然后在回调中返回所选的值 …类似于用户的操作方式 jPrompt(消息,[值、标题、回调]) 到目前为止我所拥有的一切。但是如果您注意到,该值会立即设置,我希望它等待用户单击OK。如果用户单击“取消”,则应返回null或空字符串 这是我的Javascript类: var namespace = {}; (namespace.myChooser = function () { var _dialog

我试图创建一个javascript类,它打开一个jQuery对话框,允许用户选择一个选项,然后在回调中返回所选的值

…类似于用户的操作方式

jPrompt(消息,[值、标题、回调])

到目前为止我所拥有的一切。但是如果您注意到,该值会立即设置,我希望它等待用户单击OK。如果用户单击“取消”,则应返回null或空字符串

这是我的Javascript类

var namespace = {};
(namespace.myChooser = function () {
    var _dialog = null;
    /** 
    * Function : onButtonCancel
    */
    function onButtonCancel() {
        _dialog.dialog("close");
        return null;
    }
    /** 
    * Function : onButtonOK
    */
    function onButtonOK() {
        _dialog.dialog("close");
    }
    /** 
    * Function : Initialize
    */
    function Init() {
        var dialog_options = {
            modal: false,
            disabled: false,
            resizable: false,
            autoOpen: false,
            //height: 460,
            maxHeight: 300,
            zIndex: 500,
            stack: true,
            title: 'My Chooser',
            buttons: { "OK": onButtonOK, "Cancel": onButtonCancel }
        };
        _dialog = $("#myDialog");
        // create dialog.
        _dialog.dialog(dialog_options);
        _dialog.dialog("open");
    }

    return {
        Choose: function Choose() {
            Init();
            var myChoice = $("#myOptions").val();
            return myChoice;
        }
    }
}());
我希望能够做到这一点:

namespace.myChooser.Choose(function (myChoice) {
       $("span#myChoice").text(myChoice);
    });
解决方案: 这就是它最终所做的:

$(document).ready(function () {

    $('#myButton').click(function () {
        namespace.myChooser.Choose(function (x) {
            console.log(x);
        });
    });

});

var namespace = {};
(namespace.myChooser = function (callback) {
    function _show(callback) {
            var dialog_options = {
                modal: false,
                disabled: false,
                resizable: false,
                autoOpen: false,
                //height: 460,
                maxHeight: 300,
                zIndex: 500,
                stack: true,
                title: 'My Chooser',
                buttons: { 
                    "OK": function () {
                        if (callback) callback("OK");
                    },
                    "Cancel": function () {
                        if (callback) callback("Cancel");
                    }
                }
            };
            _dialog = $("#myDialog");
            // create dialog.
            _dialog.dialog(dialog_options);
            _dialog.dialog("open");
    }

    return {
        Choose: function (callback) {
            _show(function (result){
                if (callback) callback(result);
            });
        }
    }
}());

应该做你想做的事

在你有
var\u对话框的地方添加另一个变量
,把它叫做
var\u callback
。然后在
中选择
函数,添加一个参数以获取回调函数并将其存储,如:

Choose: function Choose(f) {
    _callback = f;
    ...
}

然后,当您准备好调用回调函数时(我假定这是在onButtonOK/onButtonCancel中),使用
\u callback(参数)调用回调函数

那不是类,那是对象!函数在JS中是对象,您可以在Choose方法中有一个参数f,在闭包中保留对它的引用,并在准备回调时执行f()。@Raynos相同的区别。JS没有真正的类,只有原型和对象。@没有相同的区别,原型是一个“类”。如果你不使用原型你不使用类如果你要挑剔,原型肯定不是类。类是定义该类型所有对象的刚性结构,原型可以在运行时完全克隆和更改。与类相比,原型与没有设置结构的对象有更多的共同点。对不起,不起作用:/。我得到了同样的结果。我想要的是,在用户选择了一个值之后,这些值就会显示出来。因此,将函数引用存储在您的对象中,就像我在评论中提到的那样,然后在准备好后调用它。@Thor84no:请发布并回答一个您正在谈论的示例。我无法想象你在说什么。你们两个说的是同一件事。。。我只是不明白。。。。自从雷诺斯第一次回答我的问题后,我就把我的解决方案贴出来交给他了。无论如何,谢谢你。不,你是个学者和绅士。
Choose: function Choose(cb) {
    Init();
    var myChoice = $("#myOptions").val();
    return cb(myChoice);
}
Choose: function Choose(f) {
    _callback = f;
    ...
}