在我的laravel Jmeter 板的刀片，我试图显示一些统计数据。
他们将被更新，日期选择器的变化。
以下是我的日期选择器。

<div class="row">
        <div class="col-md-12">
            <td>
                <input id="date" class="date form-control w-50  pull-right" type="date">
            </td>
        </div>
</div>

下面是我的两个统计小部件，我有超过所有6个小部件。

<div class="col-md-2" id="shopify_widget1">
            <div class="jumbotron bg-light text-dark">
                <img class="img-fluid pull-left" src="https://cdn0.iconfinder.com/data/icons/social-media-2092/100/social-35-512.png" width="32" height="32">
                <h6 class="text-dark mt-2 px-4">Shopify</h6>
                <hr class="border border-black">
                <h5 class="text-dark">Total Orders</h5>
                <img  id="loadingImage" src="images/calculating-shopify-v2.gif" class="img-fluid w-100">
                <span class="tot_o" id="tot_o">{{ $tot_o }}</span> 
            </div>
        </div>
        <div class="col-md-2">
            <div class="jumbotron bg-dark text-white">
                <img class="img-fluid pull-left" src="https://cdn0.iconfinder.com/data/icons/social-media-2092/100/social-35-512.png" width="32" height="32">
                <h6 class="text-secondary mt-2 px-4">Shopify</h6>
                <hr class="border border-white">
                <h5 class="text-white">Total Sales </h5>
                <img  id="loadingImage" src="images/calculating.gif" class="img-fluid">
                <span class="tot_sum" id="tot_sum">{{ $sum }}</span>  {{ $crr }}
            </div>
        </div>

我使用jQuery在选择日期时获取和显示这些小部件上的数据。
这是我的jQuery

<script>
        $(document).on('change', '#date', function (e) {

            $('#tot_o').empty(); 
            $('#tot_sum').empty(); 
            $('#avg_ov').empty(); 
            $('#cus').empty();
            $('#item_sum').empty();
            $('#orders').empty();
            $("#loadingImage").show();

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $.ajax({
            type: 'GET',
            url : '/shopify_data',
            data : {selected_date : $('#date').val()},
            success:function(data){
                $("#loadingImage").hide();
                var total_orders = data.tot_o;
                var total_sales = data.sum;
                var currency = data.crr;
                var avg_ov = data.avg_ov;
                var cus = data.cus;
                var item_sum = data.item_sum;
                var orders = data.orders;
                $('#tot_o').append(total_orders);
                $('#tot_sum').append(total_sales);
                $('#avg_ov').append(avg_ov);
                $('#cus').append(cus);
                $('#item_sum').append(item_sum);
                $('#orders').append(orders);
                //console.log(total_orders);
            },
            timeout:10000
        });

    });    
    </script>

每当用户选择一个日期，我的所有小部件都只需要显示该日期的统计数据，这非常好用。
但我的问题是加载gif...即使我希望它在日期onchange时显示在所有6个小部件上，并在数据显示后隐藏它们...它只在第一个小部件上工作/出现...
在显示数据之前，如何在所有小部件上同时显示加载gif