javascript - JQuery 从 .show() 中删除动画并在显示元素后执行某些操作

Question

我试图用 jquery 显示一个元素，然后在显示该元素后提交一个表单。我有以下代码。

$("#form").submit(function(e) {
        var self = this;
        e.preventDefault(); 

        $('#element').show({
            complete: function() {
                self.submit();
            },
        });
});

我遇到的问题是上面的代码在显示元素时添加了动画。我希望元素立即显示而不是轻松显示(即没有动画)。我尝试将持续时间选项设置为 duration:1，但这似乎有不良行为，并且根本不显示该元素。我还尝试将 easing 选项设置为 null，但也没有什么乐趣。

我还尝试了下面的代码(因为它没有动画):

$("#form").submit(function(e) {
        var self = this;
        e.preventDefault(); 

        $('#element').show();
        self.submit();
});

但是这里的问题是在提交表单之前该元素没有显示。

有什么想法可以如何在没有动画的情况下显示元素，并在元素出现在屏幕上后提交表单？

使用 JQuery 1.9.1

更新:

经过几个小时的折腾，我遇到的问题似乎归结为 Safari 6.0.3 。 Safari 似乎不会在运行下一行脚本之前等待元素显示 - 所有其他浏览器都会这样做。即使只是设置一个很小的时间延迟似乎也可以解决这个问题。

Answer 1

尝试:

$("#form").submit(function(e) {
        var self = this;
        e.preventDefault(); 

        $('#element').show();

        // Delay the form submission

        setTimeout(function()
        {
             self.submit();
        }, 1000);
});

它与您的示例相同，但我添加了代码以在初始操作(1000 毫秒)后延迟一秒执行表单提交 (self.submit())。