Question

我开始使用jQuery BlockUI Plugin来阻止页面的用户活动，直到在C＃/ ASP.NET端完成按钮处理。

所以我写了这个;

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
<script src="http://malsup.github.io/min/jquery.blockUI.min.js" ></script> 
<script type="text/javascript">
    $(document).ready(function () {
        $('#MyButtonID').click(function () {
            $.blockUI({ message: '<h1>Please wait..</h1>' });
        });
    });
</script>

正如您所看到的，这是一个简单的代码，当我点击asp:button ID为MyButtonID直到完成它的过程时，会阻止用户界面。这很有效。

现在，我尝试在此点击过程中根据条件创建一些警报。如果我清楚地理解，现在我需要首先取消阻止我的页面，显示警报并再次阻止它，直到完成按钮处理。

这就是为什么我写了两个函数（也许我可以在没有它们的情况下直接调用这些$.unblockUI和$.blockUI？）在我的javascript方面为此; < / p>

function UnblockUI() {
    $.unblockUI();
}
function BlockUI() {
    $.blockUI({ message: '<h1>Please wait..</h1>' });
}

就我搜索而言，在服务器端调用Javascript函数的最常用方法是在C＃中使用ClientScriptManager.RegisterStartupScript方法。所以我试着在C＃侧警告某些东西作为例子;

if(condition)
{
    string script = string.Format("alert('{0}');", "Some error message");
    Page.ClientScript.RegisterClientScriptBlock(Page.GetType(), "alert", script, true);
}

它有效。在那之后，我尝试在我的javascript端调用UnblockUI函数来取消阻止页面，但它没有解锁它。

if(condition)
{
    Page.ClientScript.RegisterStartupScript(this.GetType(), "unblock", "UnblockUI", true);
    string script = string.Format("alert('{0}');", "Some error message");
    Page.ClientScript.RegisterClientScriptBlock(Page.GetType(), "alert", script, true);
}

如果我理解正确，这个UnblockUI参数会调用我在上面定义的UnblockUI javascript函数，此函数会调用$.unblockUI();并取消阻止我的页面被阻止，但正如预期的那样，它没有＆＃39; t work。

我在这里缺少什么？或者我没有甚至理解这个插件可以让你在使用AJAX时模拟同步行为，而无需锁定浏览器句子？

Answer 1

尝试使用函数调用，如下所示：

function unblockUI() {
    $(function() {
        $.unblockUI();
    });
}


function blockUI() {
    $(function() {
        $.blockUI({ message: '<h1>Please wait..</h1>' });
    });    
}

我希望我帮助过......

Answer 2

以下是我在当前项目中使用的内容。

  $(document).ready(function () {

      // unblock when ajax activity stops when DOM gets updated, means Ajax is completed
      $(document).ajaxStop($.unblockUI);

      //Block when trying for Ajax Activity
      $('ul#Appdropdown').click(function (ev) {

            $.blockUI(); 

       //Add ajax call to get data
      }   
 });

实现相同的功能，它将为您执行阻止和解锁。

Answer 3

使用$ ajax完成函数停止动画时出现问题，如果ajax调用失败，我重新提交ajax调用，并希望在重新提交时阻止UI。但是当在完成内部调用$ .unblockUI时，它没有正确动画。它会闪烁和消失，不会继续阻止。但是，使用全局调用停止确实有效，允许在阻止的UI上使用更新的消息重新发生阻止。

$(document).ajaxStop($.unblockUI); // this works

而不是ajax的完整功能

$.ajax({
    complete: function(jqXHR, textStatus) {                    
                $.unblockUI();// this did not always work
            }
    });

Answer 4

如果您以此方式阻止用户界面：

BlockUI.Component(".page-content");

然后这是一个可行的解决方案：

BlockUI.UnblockComponent(".page-content");

如何使用jquery-blockui取消阻止被阻止的页面？

4 个答案: