[英]add callback functionality in a JavaScript class
I'm trying to create a javascript class which opens a jQuery dialog and allows the user to select an option then returns the selected value in a callback. 我正在尝试创建一个javascript类,它打开一个jQuery对话框,允许用户选择一个选项,然后在回调中返回所选的值。
...similar to how the jQuery Alert Dialogs do it. ...类似于jQuery Alert Dialogs的做法。
jPrompt(message, [value, title, callback])
jPrompt(消息,[值,标题,回调])
jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
if( r ) alert('You entered ' + r);
});
Here is a DEMO of what i have so far. 这是我迄今为止所做的一个演示 。 But if you notice, the value gets set imidiately, and i want it to wait until the user clicks OK.
但是如果你注意到,该值会被设置为imidiately,我希望它等到用户单击OK。 If the user clicks Cancel, then it should return null or empty string.
如果用户单击“取消”,则应返回null或空字符串。
Here's my Javascript Class : 这是我的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;
}
}
}());
And i want to be able to do something like this: 我希望能够做到这样的事情:
namespace.myChooser.Choose(function (myChoice) {
$("span#myChoice").text(myChoice);
});
SOLUTION: This is what finally did it: 解决方案:这是最终做到的:
$(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);
});
}
}
}());
Choose: function Choose(cb) {
Init();
var myChoice = $("#myOptions").val();
return cb(myChoice);
}
Should do what you want 应该做你想做的
Add another variable where you have var _dialog
, call it something like var _callback
. 在
var _dialog
添加另一个变量,称之为var _callback
。 Then in your Choose
function, add a parameter to get the callback function and store it, something like: 然后在您的
Choose
函数中,添加一个参数以获取回调函数并存储它,如:
Choose: function Choose(f) {
_callback = f;
...
}
Then when you're ready to call the callback function (I presume this is in onButtonOK/onButtonCancel), call the callback function using _callback(parameter);
然后当你准备调用回调函数时(我假设它在onButtonOK / onButtonCancel中),使用
_callback(parameter);
调用回调函数_callback(parameter);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.