AJAX加载图标 [英] AJAX Loading Icon

问题描述

我正在使用以下AJAX将一些帖子内容提取到灯箱中.一切都很好，但是有点慢.谁能给我一些指向在以下代码中添加加载程序图标的指针?

I am using the following AJAX to pull some post content into a lightbox. All works great but is a bit slow. Could anyone give me some pointers with adding a loader icon to the following code?

谢谢！

            jQuery(document).ready(function ($) {

                $(".getpostidlink").unbind('click');

                $(".getpostidlink").mouseover(function (event) {
                    $(".getpostidlink").unbind('click');
                    var postlinkid = $(this).data("postid");
                    var data = {
                        action: 'getpostidhref_action',
                        security: getpostidhref.security,
                        postdata: postlinkid,
                        complete: function () {
                            $(".getpostidlink").unbind('click');
                        }
                    };
                    $.post(getpostidhref.ajaxurl, data, function (response) {
                        $(".getpostidlink").colorbox({
                            inline: true,
                            width: "90%",
                            maxWidth: 800,
                            open: false,
                            onClosed: function () {
                                window.location.reload();
                            }
                        })
                        $("div.dynamicloadcontent").replaceWith(response);
                    });
                });
            });

推荐答案

如果您检查jQuery文档中的ajax方法，则可以在其中提供一些参数来帮助您.

If you check the jQuery docs for the ajax method, there are a couple of params you can include to help here.

具体来说，您可以使用beforeSend和complete在ajax完成之前和之后显示和隐藏加载图标.

Specifically you could use beforeSend and complete to show and hide a loading icon before and after the ajax has completed.

有关更多信息，请参见此处:

See here for more info:

http://api.jquery.com/jquery.ajax/

这篇关于AJAX加载图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！