jquery 对话框隐藏时延迟淡入淡出

发布于 2024-12-07 04:28:00 字数 632 浏览 1 评论 0原文

单击我网站上的按钮会打开一个模式对话框(显示“正在保存”一词)并启动 Ajax 命令。命令完成后,我想更改对话框中的文本(更改为“已保存!”),等待 500 毫秒,然后让对话框淡出。

打开和修改对话框内容都没有问题。不过,我在延迟后淡出对话框时遇到了麻烦。下面是对话框的代码:

$("#save_filters_dialog").dialog({
    autoOpen:false,
    draggable:false,
    resizable:false,
    modal:true,
    height:54,
    width:70,
    hide:"fade",
    create: function(event,ui){
        $(this).siblings(".ui-dialog-titlebar").hide();
    }
});

我还创建了此代码来测试关闭对话框(不使用 Ajax 命令):

$("#save_filters_dialog").click(function(){
    $(this).dialog("close");
});

淡出和关闭效果很好。我似乎找不到放置 .delay(500) 的位置,以延迟关闭时的淡出。

Clicking a button on my site opens a modal dialog box (that shows the word "Saving") and starts an Ajax command. When the command is finished, I want to change the text in the dialog box (to "Saved!"), wait 500 milliseconds, and have the dialog box fade out.

Opening and modifying the contents of the dialog box are no problem. I'm having trouble though with fading the dialog box after a delay. Here's the code for the dialog box:

$("#save_filters_dialog").dialog({
    autoOpen:false,
    draggable:false,
    resizable:false,
    modal:true,
    height:54,
    width:70,
    hide:"fade",
    create: function(event,ui){
        $(this).siblings(".ui-dialog-titlebar").hide();
    }
});

I also created this code to test closing the dialog (without using an Ajax command):

$("#save_filters_dialog").click(function(){
    $(this).dialog("close");
});

The fade out and closing works fine. I just can't seem to find where to put the .delay(500) that delays the fade out on close.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

韵柒 2024-12-14 04:28:00

这就是我关闭对话框消息的方式:

$("#save_filters_dialog").dialog(
{
 autoOpen:false,
 draggable:false,
 resizable:false,
 modal:true,
 height:54,
 width:70,
 hide: {effect: "fadeOut", duration: 1000}
}, setTimeout(function(){$("#save_filters_dialog").dialog("close");},2000));

this is how I close my dialog message:

$("#save_filters_dialog").dialog(
{
 autoOpen:false,
 draggable:false,
 resizable:false,
 modal:true,
 height:54,
 width:70,
 hide: {effect: "fadeOut", duration: 1000}
}, setTimeout(function(){$("#save_filters_dialog").dialog("close");},2000));
属性 2024-12-14 04:28:00

使用 setTimeout 和一个匿名函数来包装您想要在其之后执行的操作:

setTimeout(function(){ console.log('Executed after 500ms'); }, 500);

Use setTimeout and an anonymous function to wrap what you want to do after it:

setTimeout(function(){ console.log('Executed after 500ms'); }, 500);
贱贱哒 2024-12-14 04:28:00

您可以使用 setTimeout() 函数来实现这一点。

$("#save_filters_dialog").click(function(){
    setTimeout('closeDialog('+this+')',500);
});

function closeDialog(object){
    $(object).dialog("close");
}

You could use the setTimeout() function for that.

$("#save_filters_dialog").click(function(){
    setTimeout('closeDialog('+this+')',500);
});

function closeDialog(object){
    $(object).dialog("close");
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文