我正在使用 jquery-ui 对话框。 我的问题是单击 x 按钮关闭对话框后,我还需要执行 cancel() 函数。
我该怎么做?
var content =
{
autoOpen : false,
modal : true,
width : 350,
minHeight : 50,
height : 350,
position : "center",
resizable : false,
draggable : false,
close : function () {$(".privacy_modal").prop("checked", false);},
buttons:
{
"Cancel": function cancel()
{
$(".privacy_modal").prop("checked", false); $(this).dialog("close");
},
"Accept": function accept()
{
$(".privacy_modal").prop("checked", true); $(this).dialog("close");
}
}
};
注意:使用 close 并不能解决我的问题,因为当我单击接受按钮时它会覆盖该函数
您可以使用第三方变量(bAccepts 默认为 False)和第三方方法。
当用户接受时:
当用户取消时:
当 onClose 被触发时,调用 doClose() 方法,该方法执行以下操作:
这是一些未经测试的伪代码。请参阅工作代码。
var bAccepts = false;
var content = {
autoOpen : false,
modal : true,
width : 350,
minHeight : 50,
height : 350,
position : "center",
resizable : false,
draggable : false,
close : function () { if (bAccepts) {...} else {...} },
buttons: {
"Cancel": function cancel() { bAccepts = false; $(this).dialog("close");},
"Accept": function accept() { bAccepts = true; $(this).dialog("close");}
}
};
工作演示 http://jsfiddle.net/Ea6Hm/1/
您可以使用:http://docs.jquery.com/UI/Dialog#event-beforeClose
使用
beforeClose
您可以在对话框关闭之前调用您想要调用的任何函数。
希望这有帮助,
代码
$(document).ready(function() {
$('#theLink').click(function() {
$("#forgot-dialog").dialog("open");
});
$("#forgot-dialog").dialog({
modal: true,
autoOpen: false,
height: 255,
width: 300,
beforeClose: function() {
alert("Do whatever before Close");
},
buttons: {
"Retrieve": function() {
document.forms["forgotform"].submit();
},
Cancel: function() {
$(this).dialog("close");
}
},
});
});
对于 beforeClose,您需要检查 X 是否被单击,否则它也会被“确定”按钮触发,源。
beforeClose: function (e, ui) {
if ($(e.currentTarget).hasClass('ui-dialog-titlebar-close'))
e.preventDefault();
}