Когда jQuery ajax-вызов запущен, loadmask не запускается

Question

Когда jQuery AJAX называется async:false Маска не стреляет. Даже если я позвоню до Ajax:

$("#d").on("click", function () {
    $("#d").mask("Waiting...");
    fn();
    $("#d").unmask("Waiting...");
});

Полный код ниже:

<link href="jquery.loadmask.css" rel="stylesheet" type="text/css" />
<script src="jquery-latest.pack.js" type="text/javascript"></script>
<script src="jquery.loadmask.js" type="text/javascript"></script>

<div id="d" style="border: 1px solid red; width: 300px; height: 200px">asdfasdf</div>
<script>

    $(function () {
        $("#d").on("click", function () {
            fn();
        });
    });

    function fn() {
        var a = JSON.stringify({
            text: 'some text',
            array: [1, 2, 'three'],
            object: {
                par1: 'another text',
                par2: [3, 2, 'one'],
                par3: {}
            }
        });
        var data = {
            json: a,
            delay: 3
        }


        $.ajax({
            url: "http://jsfiddle.net/echo/json/",
            data: data,
            type: "POST",
            async: false,
            beforeSend: function (response) {
                $("#d").mask("Waiting...");
            },
            success: function (response) {
                console.log(response);
            },
            complete: function () {
                $("#d").unmask("Waiting...");
            }
        });

    }
</script>

Answer 1

Это потому, что поток браузера заблокирован ожиданием ajax. решение состоит в том, чтобы использовать setTimeout().

Пытаться

$("#d").on("click", function () {
    $("#d").mask("Waiting...");
    setTimeout(function(){
        fn()
        $("#d").unmask("Waiting...");
    }, 1);
});

Answer 2

Как называется ваш Асинхронный скрипт не загружен jQuery $(document).ready и UpdatePanels?

Я думаю, что это будет работать

  function BindEvents(){
        $("#d").on("click", function () {
            $("#d").mask("Waiting...");
            fn();
            $("#d").unmask("Waiting...");
        });
     }

    $(document).ready(function () {
         BindEvents();
    });

    <script type="text/javascript">
        // Create the event handler for PageRequestManager.endRequest
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(BindEvents);
    </script>