JavaScript：没有 alert() 函数无法工作答案

【问题标题】：JavaScript: function not working without alert()JavaScript：没有 alert() 函数无法工作
【发布时间】：2019-10-29 15:46:20
【问题描述】：

Possible solution

各位程序员，大家好！

我写信给你是为了请求一些关于我最近遇到的问题的帮助。问题如下：

1) 我有一个 ajax 请求，用 jQuery 实现。

2) 在返回成功响应后，脚本应重新加载相应更改的页面，如果有任何验证错误，请将其插入隐藏字段之后，用于存储非关键杂项数据。如果有任何验证错误，则不会保存更改，页面只是重新加载验证错误消息。验证本身由 servlet 负责。

3) 我注意到在实际附加错误消息之前出现任何类型的 alert() 时一切正常，但我不希望出现这样的警报。

这是 JavaScript 代码：

$('#randomFormElement').submit(function() {
        $(this).ajaxSubmit({
            success: function (data, status) {
                randomFunctionToReloadThePage(arg1, arg2, arg3);
                var errors = $(data).find('.classNameOfTheErrors').xml();
                //alert(something);
                $(errors).insertAfter('#idOfTheHiddenField');
            },
            error: function (jqXHR, textStatus, thrownError) {
            //Error handling if the ajax response fails.
            }
         });
});

所以，主要问题是：alert() 是怎么让它工作的？

===========================

在 Chrome 上，这两种方法都不起作用。

在 FF 上，它仅在存在一些 alert() 时才起作用。

提前致谢！

【问题讨论】：

randomFunctionToReloadThePage 是做什么的？如果它的任何部分是异步的，则警报引入的延迟可能会有所不同。
作为旁注。如果您在 ajax 请求后重新加载页面？那你为什么首先执行一个ajax请求。为什么不提交整个页面，然后您就不必重新加载它。
在 ajax 调用完成之前您的页面是否已刷新？您是否尝试通过 ajax 提交表单？
到问题本身：执行 insertAfter 时您的页面是否完全重新加载？
@roel：我只重新加载页面的一部分，而不是整个页面。

标签： javascript jquery ajax

【解决方案1】：

alert() 函数会阻止代码执行并延迟其底部的 javascript 代码的处理。这可以让 ajax 请求有时间完成。

【讨论】：

在ajax调用的success函数中，说明此时调用肯定已经完成了。
@UweB：第一次通话已经完成，但也许randomFunctionToReloadThePage 也在后台做了一些事情。
我同意@Thilo，我也同意mornaner 的第一部分，但我不同意alert() 会给ajax 请求 时间来完成。它将为 randomFunc... 中可能发生的任何异步操作提供时间来完成。 :-)
randomFunctionToReloadThePage 不是异步的，也没有调用任何异步函数。此外，调用 insertAfter() 函数时，DOM 元素会完全呈现。
+1 因为“添加警报使我的代码工作”几乎总是意味着您对异步事件的计时有问题。这就是为什么alert() 作为调试工具很烂的主要原因。请改用console.log()；它不会干扰您的处理顺序。

【解决方案2】：

这不是一个答案，而是一个调试提示（无法在注释中进行正确的代码格式化）。

在alert()之后添加这两个调用：

console.log( "errors:", errors );
console.log( "hidden:", $('#idOfTheHiddenField')[0] );

将警报注释掉并运行它。它在开发者控制台中显示什么？

然后为了比较，取消注释警报，使其在这两个调用之前运行，并在 Firefox 中运行。现在控制台里有什么？

【讨论】：

【解决方案3】：

感谢大家的回答，特别是 gvee 的回答，我设法让它工作。显然，randomFunctionToReloadThePage() 中确实发生了一些异步操作，我设法使用.ajaxStop() method. 修复它

编辑：在使用 ajaxStop() 时发现了第二个错误。我发现工作正常的解决方案如下：

1) 向 randomFunctionToReloadThePage 添加一个额外的参数

2) 在相应页面中使用该额外参数调用函数。

【讨论】：

你应该 +1 提到 randomFunctionToReloadThePage() 可能是异步的每个人，你评论它说它不是:)

【解决方案4】：

尝试添加：缓存：false

$('#randomFormElement').submit(function() {
    $(this).ajaxSubmit({
        cache: false,
        success: function (data, status) {
            randomFunctionToReloadThePage(arg1, arg2, arg3);
            var errors = $(data).find('.classNameOfTheErrors').xml();
            //alert(something);
            $(errors).insertAfter('#idOfTheHiddenField');
        },
        error: function (jqXHR, textStatus, thrownError) {
        //Error handling if the ajax response fails.
        }
     });

});

【讨论】：

【解决方案5】：

这也发生在我身上。我们的代码中不能有警报。 Settimeout 函数解决了我的问题。将“alert”替换为"setTimeOut" 函数并在其中添加其余代码。

setTimeout(function(){ //your code here }, 300);

【讨论】：