ajax调用成功后如何执行JS函数？答案

【问题标题】：How to execute JS function after successfull ajax call?ajax调用成功后如何执行JS函数？
【发布时间】：2016-01-23 22:32:50
【问题描述】：

我想全屏展示我的窗口。

我有一个工作功能，但我有一个问题：

在用户单击 UI 中的某个按钮后，我正在发送一个 AJAX 调用，以获取一些数据并准备它，在这个 ajax 调用之后（在success 我想全屏演示我的数据，但我可以不要那样做，因为它会引发错误： Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture.

如您所知，我有用户操作 - 点击按钮，但如果我试图在 ajax 调用中执行 fullscreen function，这还不够。

我也试图使用全局变量来获得一个状态（我是否需要显示全屏（这取决于响应解析的结果（在 AJAX 调用之后）），但它也不起作用。我是以这种方式尝试：

ISFULLSCREEN = false;

function get_ajax() {
    ajax_call ()
    .success(response) {
        if (response.fullscreen) {
           ISFULLSCREEN = true;
        }
    }
 }


function useFullscreen() {
    if (ISFULLSCREEN) {
        use_fullscreen();
    }
}

我的按钮看起来像：

<button onclick="get_ajax();useFullscreen()" value="click me" />

但函数 useFullscreen 运行得比 ISFULLSCREEN 的值更改为 true 快

有人知道如何解决这个问题吗？

非常感谢！

【问题讨论】：

你可以在你的成功函数中调用 useFullscreen。
@Avi 他们在问题中说它无法执行
我不能，它会引发同样的错误：“无法在 'Element' 上执行 'requestFullScreen'：API 只能由用户手势启动。”。这是我的第一个实现
一个建议是放置另一个按钮，上面写着“最佳观看全屏”，并让用户点击
@pivanchy 首先只有 get_ajax() 绑定到按钮，响应时将 onclick 函数更改为 useFullScreen() 并通过代码触发新的 onclick 事件。

标签： javascript jquery ajax callback fullscreen

【解决方案1】：

也许在您的 ajax 请求中，使用async: false 使获取同步，因此将所有执行保持在同一事件中（来自用户单击）。

这样做的缺点是如果需要很长时间可能会挂起页面

【讨论】：

这看起来像是一种解决方法，但不幸的是，它不是解决方案
我能想到的唯一其他方法是，当用户单击按钮时，它会立即进入全屏状态，然后在 ajax 关闭并完成其操作时显示一些加载或请等待屏幕
这也不是一个解决方案，因为我不需要总是全屏模式。我正在解析来自 AJAX 响应的数据，然后我知道：我是否需要全屏..
我能想到的唯一其他解决方案是您在单击按钮之前调用 AJAX，之前的某个事件。我觉得没有别的办法了
我使用了异步 AJAX 调用，因为我没有太多来自服务器的数据，而且不需要太长时间。其他解决方案不是很有用

【解决方案2】：

你可以使用callback function，回调函数是作为参数传递给另一个函数的函数，所以你可以使用它，它会在你等待的ajax响应到来后执行，见下文示例：

ISFULLSCREEN = false;

function get_ajax(useFullscreenCallback) {
    ajax_call ()
    .success(response) {
        if (response.fullscreen) {
           ISFULLSCREEN = true;
           useFullscreenCallback();
        }
    }
 }


function useFullscreen() {
    if (ISFULLSCREEN) {
        use_fullscreen();
    }
}

get_ajax(useFullscreen);

参考：Callback Function Mozilla web docs

【讨论】：

【解决方案3】：

这对您有帮助吗？：Run a website in fullscreen mode

答案基本上是说你不能在没有用户交互的情况下强制全屏更改，但有一些替代建议

【讨论】：

我正在阅读这篇文章，但对我的情况没有帮助

【解决方案4】：

将 async : false 添加到 ajax 调用并在 ajax 成功时调用函数 useFullscreen 并将其从按钮 onclick 事件中删除

【讨论】：