为什么 Jquery .hide() 不隐藏元素 div？答案

【问题标题】：Why Jquery .hide() does not hide an element div?为什么 Jquery .hide() 不隐藏元素 div？
【发布时间】：2017-02-12 21:40:51
【问题描述】：

所以。我有下面的 Jquery/Ajax 和 .hide() 方法似乎没有隐藏元素 loadingdiv。

<script type="text/javascript">
        $(document).ready(function ($) {
            //show a progress modal of your choosing
            $('#loadingdiv').show();

        $.ajax({
            url: "@Url.Action("ToDo","Test")",
            dataType: 'html',
            success: function(data) {
                $('#bookListDiv').html(data);
            }});
        });
        $('#loadingdiv').hide();
</script>

【问题讨论】：

这个问题中有一些很好的链接，他发布了他的代码，说明他是如何工作的。希望对你有帮助stackoverflow.com/questions/41988881/…
另外，stackoverflow.com/questions/1570127/…

标签： jquery ajax asp.net-mvc

【解决方案1】：

假设你有一些这样的 HTML：

<div id="StaticContent">
  ...
</div>
<div id="DynamicContent">
  <img src="~/Content/Images/ajax-loader.gif" alt="loading..." />
</div>

然后你可以使用一个简单的 jquery load() 调用来实现你想要的。

$(function() {
  $('#DynamicContent').load("/path/to/api");
});

【讨论】：

【解决方案2】：

我认为 hide() 函数似乎不起作用，因为当您认为它没有被调用时，它没有被调用。您编写脚本标记的方式是在页面就绪函数之前调用 hide() 函数。更改您的标记以在 ajax 成功回调中调用 hide() 函数。

$.ajax({
        url: "@Url.Action("ToDo","Test")",
        dataType: 'html',
        success: function(data) {
            $('#bookListDiv').html(data);
            $('#loadingdiv').hide();
        }});

但是，如果您按照其他答案中的建议进行操作，则无需执行此步骤。加载的 gif 将替换为返回给 ajax 调用的内容。

【讨论】：