0

我想用插件http://www.malsup.com/jquery/block/显示“等待”消息。ajax.php 文件是

<?php
sleep(2);
$arr = array('m' => 'OK');
echo json_encode($arr);
?>

而jquery代码是

function block() {
    $.blockUI();
    $.ajax({
        type: 'POST',
        dataType: 'json',
        url: 'ajax.php',
        async: false,
        data: {},
        success: function(data) {
            $.unblockUI();
        }
    });
}
block();
$('#button').click(function() {block();});

如何在使用 ajax 获得“OK”之前显示“正在加载..”消息并在使用 ajax 之后隐藏？现在它在使用后显示和隐藏。我还需要 ajax json 中的“async: false”。另外，这个块显示两秒钟。

谢谢

4

1 回答 1

1

在 jquery ajax 中，它们是一个名为“beforeSend”的属性，像这样使用

$.ajax({
    type: 'POST',
    dataType: 'json',
    url: 'ajax.php',
    async: false,
    data: {},
    beforeSend: function(){
        showLoadingScreen();
    },
    success: function(data) {
        alert(data.m);

    },
    complete: function(data){

         $.unblockUI();
    }
});

function showLoadingScreen()
{
    //include block.js for using this
    $.blockUI({ 
        message: 'Loading....',
        css: { 
            border: 'none',
            width: '300px', 
            height: '50px',
            padding: '15px',
            backgroundColor: '#000', 
            '-webkit-border-radius': '10px', 
            '-moz-border-radius': '10px', 
            opacity: .5, 
            color: '#fff'
        }       
    }); 
}
于 2013-05-12T09:39:18.743 回答