使用jQuery实现，点击显示弹框，背景虚化，点击空白处，弹框消失

HTML代码

<div class="layer" id="back" style="display: none; position:absolute; width:100%; height: 100%; top: 0; left: 0; z-index: 2; background: rgba(255, 255, 255, .6);" disabled="disabled"></div>   <!-- 虚化层 -->

    <div class="container">
        <div id="showRename" style="display:none; width:30%; position:absolute; top: 300px; left: 380px;box-shadow: 0 0 5px #ccc;z-index: 9;">   <!-- 要显示的 -->
            <div class="input-group" >
                <input type="text" id="oldname" class="form-control" />
                <span class="input-group-addon" onclick="getValue()">重命名</span>
            </div>
            <input type="hidden" id="newname" class="form-control">
        </div>

重命名

## js代码

$("#renameClick").click(function(e) {
e.stopPropagation(); // 阻止冒泡
$(’#back’).css(“display”, “block”); // 显示
$("#showRename").css(“display”, “block”);

        $("#back").bind("click", function(e) {   // 相当于点击空白消失
            $('#back').css("display", "none");
            $("#showRename").css("display", "none");
        });
    });