Question

我有一个下拉列表，当我更改下拉列表时，将加载一个telerik树，它将在部分视图中加载，并且ajax加载栏仅出现在树内容中。但我想禁用页面（用户不应该使用该页面，但他应该看到页面），同时加载内容并向用户显示“loading .....”屏幕。

Answer 1

也许您可以使用BlockUI

Answer 2

如果你使用MVC的Ajax.BeginForm进行ajax回调（而不是jquery），你可以使用名为AjaxOption的内置LoadingElementId。缺点是它需要您使用表单发布而不是使用$.ajax()。在表单中，您必须有一个不可见的按钮，下拉列表的onchange事件必须在隐藏字段中构建表单数据，然后向隐藏按钮发出单击事件。

另一种方法就是抛弃这样一个div：

<div id="loading-pane">
    <img src='<%: Url.Content("~/Content/Images/ajax-loader.gif") %>' />
</div>

然后css就像这样

#loading-pane { display:none; opacity: 0.8;  position: fixed; top: 0; left: 0; 
    width: 100%; height: 100%; filter: alpha(opacity=80); -moz-opacity: 0.8; 
    z-index: 999998; background-color: #ffffff; }
#loading-pane img { position: absolute; top: 40%; left: 47%; z-index: 999999; }

然后就是这样的

$('#MyDropDown').change(function() {  
    $('#loading-pane').show();

    $.ajax({
        success: function() {
            $('#loading-pane').hide();
        }
    });
});

部分视图（AJAX）加载时，MVC视图页应该隐藏

2 个答案: