Question

我有一个发送数据的ajax脚本。我希望在发送/处理数据之前显示<?php $response = {"metafields":[{"id":30007223558,"namespace":"global"}, {"id":454872458451,"namespace":"local"}, {"id":154644565,"namespace":"global"}]} ?> <?php $response = json_decode($response); ?> 3秒钟。一旦这3秒结束，数据将正常发送到flip-process.php，然后返回结果将成功显示。但目前它如此之快，以至于我只能看到硬币在这里翻转（我想要显示的动画）。因此，在处理ajax请求之前，我希望延迟3秒。我怎么能这样做？

这是我的ajax脚本。

.coin-flip

Answer 1

easist选项是在成功函数中使用超时，而不是延迟实际请求：

success: function(html){
    setTimeout(function(){

        $(".message").html(html).fadeIn();
        $("#coins").show();
        $(".coin-flip").hide();

    },3000);
}

Answer 2

你可以在超时中包装ajax调用

                    <script type="text/javascript">
        $(document).ready(function() {
            $("#submit").click(function() {
                var dataString = {
                    flip: $("#flip").val(),
                    amount: $("#amount").val(),
                };
                var processing=false;


            $.ajax({
                    type: "POST",
                    url: "flip-process.php",
                    data: dataString,
                    cache: true,
              beforeSend: function(){
                        $("#coins").hide();
                        $(".coin-flip").show();
              },
                    success: function(html){
                        $(".message").html(html).fadeIn();
                            $("#coins").show();
                            timeout = setTimeout(function(){
                            if (!processing)
                           {
                            processing=true;
                            $(".coin-flip").hide();
                            }
                    }, 2000}
                });

);
                return false;
            });
        });
        </script>

Answer 3

只需在beforeSend块中使用setTimeout。

<script type="text/javascript">
$(document).ready(function() {
    $("#submit").click(function() {
        var dataString = {
            flip: $("#flip").val(),
            amount: $("#amount").val(),
        };
    $.ajax({
            type: "POST",
            url: "flip-process.php",
            data: dataString,
            cache: true,
            success: function(html){
                setTimeout(function(){

                    $(".message").html(html).fadeIn();
                    $("#coins").show();
                    $(".coin-flip").hide();

                },3000);
             }
        });
        return false;
    });
});
</script>

Answer 4

试试这个

export class RosterPage extends Page implements OnInit 
{
    roster:any[];
    players:any[];

    constructor(private location: Location, private playersService: PlayersService) {
        super(location);
    }

    ngOnInit() {
        this.playersService.getRoster()
        .do(roster=>this.roster=roster)
        .switchMap(roster=>this.playersService.getPlayers(roster))
        .do(players=>this.players=players)
        .subscribe();
    }
}

在处理之前将ajax请求延迟3秒

4 个答案: