Question

我想在有人点击我网站上的任何元素时显示加载程序。

我的代码：

(function ($) {
    $('body').append("<div id='loader-box'></div>");
    $("loader-box").html("");
    $("a").on('click', function (e) {
        $("loader-box").html("<div class='loader-wrapper'><div class='loader-image'></div></div>");
    });
}(jQuery));

问题是追加不起作用。我不懂为什么。谢谢！

---更新---

我找到了一个解决方案，感谢所有特别是Andrei Cristian Prodan，他帮我解决了.on（）函数的问题。我还使用了错误的函数来添加“loader-box”div。

这是我的代码：

(function($){
    $("body").prepend('<div id="loader-box"></div>');
    $("#loader-box").html("");
    $("html").on("click", "a",function(){
        $("#loader-box").html('<div class="loader-wrapper"><div class="loader-image"></div></div>');
    });
}(jQuery));

谢谢！

Answer 1

你在选择器$（“＃loader-box”）中缺少“＃”;

此外，如果您在页面中存在锚点之前执行此代码（例如，在您的身体顶部或标题内），则不会分配点击，因为$（'a'）将为空。< / p>

请改为：$('html').on('click', 'a', function() {...} );

Answer 2

你的选择者只是一点点;缺少＃：

<script>
$(function($){
    $('body').append("<div id='loader-box'></div>");
        $("#loader-box").html("");
        $("a").on('click', function(e){
            $("#loader-box").html("<div class='loader-wrapper'><div class='loader-image'></div></div>");
        });
});
</script>

DOM ready需要正确编写。

加载点击全部＆＃34; a＆＃34; HTML元素

2 个答案: