<div id='pop-div' class="pop-box">

    <div class="input-group has-info">

        <input class="form-control" id="bankCode" type="text" placeholder="请输入银行卡号" />

        <span class="input-group-addon" id="checkBtn" ng-click="checkBtn()"><i class="searchicon fa fa-credit-card"></i> 银行卡校验</span>

    </div>

</div>

//遮罩层

function popupDiv(div_id) {

    divid = div_id;

    var div_obj = $("#" + div_id);

    var windowWidth = document.body.clientWidth;

    var windowHeight = document.body.clientHeight;

    var popupHeight = div_obj.height();

    var popupWidth = div_obj.width();

    //添加并显示遮罩层

    $("<div id='mask'></div>").addClass("mask")

                              .width("100%")

                              .height("100%")

                              .click(function () { hideDiv(div_id); })

                              .appendTo("body")

                              .fadeIn(200);

    div_obj.css({ "position": "absolute" })

           .animate({

               left: windowWidth / 2 - popupWidth / 2,

               top: windowHeight / 2 - popupHeight / 2, opacity: "show"

           }, "slow");

}

function hideDiv(div_id) {

    $("#mask").remove();

    $("#" + div_id).animate({ left: 0, top: 0, opacity: "hide" }, "slow");

    $("#bankCode").val("");

}

.pop-box {

    z-index:; /*这个数值要足够大，才能够显示在最上层*/

    margin-bottom: 3px;

    display: none;

    position: absolute;

    background: #FFF;

    border: solid 1px #EAEAF3;

    top: 185px !important;

}

.pop-box-body {

    clear: both;

    margin: 4px;

    padding: 2px;

}

.mask {

    background-color: rgba(234, 237, 248, 0.8);

    position: absolute;

    top: 0px;

    left: 0px;

    filter: Alpha(Opacity=60);

}

.input-group {

    width: 1000px;

    height: 45px;

}

.form-control {

    height: 45px;

}