Question

单击/选中以展开表列时，如何显示“加载”消息，并在消息消失后立即隐藏消息。 Here是我到目前为止的演示。我可以显示消息，但是一旦完成作业就无法隐藏它。当我试图扩展一个大表时，它似乎很有用，我认为让用户知道它正在工作会很好。任何帮助/建议将不胜感激。

$(document).ready(function() {
    $("#load").hide();
    $("#check").live("click", function() {
        $("#load").show();
        if ($("#check").is(":checked")) {
            $(".hidden").show();
        } else {
            $(".hidden").hide();
        }
    });
    $("#load").hide();
});

Answer 1

你真的需要加载消息吗？

无论如何，你可以像这样隐藏它：

$(document).ready(function() {
    $("#load").hide();
    $("#check").live("click", function() {
        $("#load").show();
        if ($("#check").is(":checked")) {
            $(".hidden").show();
            $("#load").hide();
        } else {
            $(".hidden").hide();
            $("#load").hide();
        }
    });
    $("#load").hide();
});

Answer 2

创建加载文本有点无用，因为这只需要一个回流到DOM，所以你实际上看不到“loading ..”消息。

但是如果你想创建一个从服务器获取数据的ajax调用，它会很有用，但在这个用法中这是无用的

但是如果你坚持这个，你需要创建一个新的“线程”来检测所显示的表。例如

$("#link").click(function() {
$("#text").html("loading...");
$("#table").show();
window.setTimeout(function() {while(true){if($("table").is(":visible")){$("#text").html("");break;}}},0);
});

Answer 3

这是页面生命周期的问题。您的代码中没有任何阻塞事件，并且您的代码没有回调知道“嘿，现在显示隐藏的元素，隐藏加载栏。”看看这个更新的jsfiddle。在调用方法隐藏加载消息之前，我告诉代码在显示或隐藏之后等待.5秒，而不是回调。

如果您正在使用回调（例如AJAX帖子）执行某些操作，那么您可以在成功或请求失败时调用此方法。

显示/隐藏html表的加载消息

3 个答案: