Twitter bootstrap 3 覆盖引导div行

我在用Bootstrap，我有一张登记表。单击register按钮时，我调用ajax发送表单。在执行远程页面时，我想用一个div覆盖表单，并显示一条类似“请稍候”的消息。我如何才能以精确的大小覆盖行。 这是我的表格：

<div class="row">
<div class="col-xs-12 col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3">
    <form id="forminscr" method="post">
        <h2>Registration <small></small></h2>
        <hr class="colorgraph">
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-6">
                <div class="form-group">
                    <input type="text" name="name" id="name" class="form-control input-lg" placeholder="Name" tabindex="1">
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-6">
                <div class="form-group">
                    <input type="text" name="surname" id="surname" class="form-control input-lg" placeholder="Surname" tabindex="2">
                </div>
            </div>
        </div>
        <div class="form-group">
            <input type="text" name="company" id="company" class="form-control input-lg" placeholder="Company" tabindex="3">
        </div>
        <div class="form-group">
            <input type="email" name="email" id="email" class="form-control input-lg" placeholder="Adresse email" tabindex="4">
        </div>
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-6">
                <div class="form-group">
                    <input type="password" name="mdp" id="mdp" class="form-control input-lg" placeholder="Mot de passe" tabindex="5">
                </div>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-6">
                <div class="form-group">
                    <input type="password" name="mdp2" id="mdp2" class="form-control input-lg" placeholder="Confirmer" tabindex="6">
                </div>
            </div>
        </div>
        <hr class="colorgraph">
        <div class="row">
            <div class="col-xs-12 col-md-6"><input type="submit" value="Register" class="btn btn-primary btn-block btn-lg" tabindex="7"></div>
            <div class="col-xs-12 col-md-6"><a href="connexion.php" class="btn btn-success btn-block btn-lg">Login</a></div>
        </div>
    </form>
</div>

登记处

您在ajax中设置了“请稍候”类

CSS代码

.please-wait{
background-color: rgba(0, 0, 0, 0.8);
bottom: 0;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 99;
display:none;
}
.please-wait-text{
border: 1px solid #ffffff;
border-radius: 4px;
color: #ffffff;
float: left;
font-size: 22px;
left: 38%;
padding: 20px;
position: absolute;
top: 40%;
width: auto;
}

Js代码

$( document ).ready(function() {
 setTimeout(function(){ 
 $('.please-wait').show();
 }, 3000);

}))

[

//一个$（document）.ready（）块。
$（文档）.ready（函数（）{
setTimeout（函数（）{
$（'.please wait'）.hide（）；
}, 3000);
})；

。请稍候{
背景色：rgba（0,0,0,0.8）；
底部：0；
左：0；
位置：固定；
排名：0；
宽度：100%；
z指数：99；
}
.请稍候{
边框：1px实心#ffffff；
边界半径：4px；
颜色：#ffffff；
浮动：左；
字体大小：22px；
左：38%；
填充：20px；
位置：绝对位置；
最高：40%；
宽度：自动；
}

登记处


请稍候。。。

请展示如何“调用ajax”所提供的演示。