javascript - 当这个 ajax jquery 触发时，我想要一个加载 1 秒的图像

Question

我有这个代码

<script type="text/javascript">
    $(function () {
        $(".a").live("click", function () {
            var $this = $(this),
        ProductImageId = $this.data('ProductImageId');
            $.ajax({
                url: '/Home/AddToCart',
                type: "post",
                cache: false,
                data: { ProductImageId: ProductImageId },
                success: function (data) {
                    data = eval(data);
                    $this.addClass('productSelected');
                },
                error: function (result) {
                    $(".validation-summary-errors").append("<li>Error connecting to server.</li>");
                }

            });
        });

每次有人点击这个按钮时，我都希望加载一张图片大约 1 秒 所以用户知道发生了什么事..

感谢任何形式的帮助

Answer 1

类似于:

var $loader = $('<img src="loader.gif">').appendTo(document.body);

然后

success: function (data) {
    setTimeout(function() {
        $loader.remove();
        data = eval(data);
        $this.addClass('productSelected');
    },1000);
}

它将显示图像 1 秒 + ajax 加载时间。虽然，作为您网站的访问者，我可能更愿意跳过 1 秒的延迟...