Javascript 自定义JS使用jQuery.Deferred确认模态,并根据按钮返回值
我是一名java开发人员,最近刚刚进入Javascript世界,所以如果我犯了一些愚蠢的错误或假设,请原谅我。我试图将本机浏览器/js“确认”对话框转换为主要使用主干框架开发的自定义模态。目前,这些模态不支持“确认”类型的功能。我认为主要的问题是我的modals当前不是异步工作的 我调用了一个打开模式的方法,我希望从调用返回一个“true”或“false”值,这取决于用户单击的按钮。但是,当前我的方法在显示模式时立即返回,并且不等待按钮单击。模态系统支持对每个按钮进行单独的回调,这可以在调用“openPortletModal”方法时定义,我将在下面演示。但是,“confirmDiscard”方法返回一个未定义的值,而从不等待任何按钮调用。我的问题是,在进行回调之前是否可以暂停方法的执行 在研究过程中,我确实发现了一些关于jQuery.Deferred的信息,但我还没有找到一种明确的方法来利用它来获得我想要的功能,而且我看到的示例中似乎没有基于回调包含不同的返回值 以下是我的示例代码:Javascript 自定义JS使用jQuery.Deferred确认模态,并根据按钮返回值,javascript,jquery,asynchronous,modal-dialog,confirm,Javascript,Jquery,Asynchronous,Modal Dialog,Confirm,我是一名java开发人员,最近刚刚进入Javascript世界,所以如果我犯了一些愚蠢的错误或假设,请原谅我。我试图将本机浏览器/js“确认”对话框转换为主要使用主干框架开发的自定义模态。目前,这些模态不支持“确认”类型的功能。我认为主要的问题是我的modals当前不是异步工作的 我调用了一个打开模式的方法,我希望从调用返回一个“true”或“false”值,这取决于用户单击的按钮。但是,当前我的方法在显示模式时立即返回,并且不等待按钮单击。模态系统支持对每个按钮进行单独的回调,这可以在调用“o
confirmDiscard: function(context) {
var deferred = new $.Deferred();
MyModal.openPortletModal(context, null, {
views: [{
name: "auth",
title: "Confirmation",
renderResponseData: "This is a test", //Message that modal renders
buttons: [{
type: "FINISH",
label: "OK",
click: function() {
console.log("CLICKED OK");
deferred.resolve("true"); //this is ultimately what I'd like to return from the confirmDialog() method
return false; //Modal system expects a "false" value from callback if there is no AJAX call to be made.
},
}, {
type: "CANCEL",
click: function() {
console.log("CLICKED CANCEL");
deferred.resolve("false");
return false;
},
}]
}]
});
deferred.done(function(value) {
alert(value); //This does get called on button click, but by now the confirmDiscard method has already returned.
return value;
})
return deferred.promise();
},
考虑到这种模式,javascript中是否有办法让该方法在响应模态时等待 我建议你用一种和你一样的方式,但有点不同。我希望它能帮助你
cutomConfirm: function(text) {
var d, rendered, template,
_this = this;
template = $('#custom_confirm_temp');
rendered = $.tmpl($(template).template(), {
text: text || ''
});
$.blockUI({
message: rendered,
showOverlay: true,
onUnblock: function() {
return $(document).unbind('click');
},
css: {
width: '600px',
height: '150px',
opacity: '1',
border: '0',
backgroundColor: 'none'
}
});
d = $.Deferred();
rendered.find('#OK').click(function() {
$.unblockUI();
return d.resolve();
});
rendered.find('#CANCEL').click(function() {
$.unblockUI();
return d.reject();
});
return d;
}
您需要创建模板(使用id=“custom\u confirm\u temp”)并在需要时调用