需求是点击登录弹出登录框，不想登录点击空白区域时登录框要隐藏，这个空白区域是一个空白满屏的div，他是登录框的父级，在这个父级添加点击事件隐藏div后，点击登录框时也会直接隐藏起来，这个时候需使用javascript中的stopPropation()方法。

引用下专业的解释：不再派发事件，终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后，该节点上处理该事件的处理程序将被调用，事件不再被分派到其他节点。

语法：event.stopPropagation()

代码：

<div class="loginBox" id="loginBox" style="display: none">
    <div class="body" id="loginBody">
        <form class="form-horizontal" role="form">
            <div class="form-group">
                <div for="username" class="col-sm-2 control-label">帐号</div>
                <div class="col-sm-10"><input type="text" name="username" class="form-control" id="username"></div>
            </div>
            <div class="form-group">
                <div for="password" class="col-sm-2 control-label">密码</div>
                <div class="col-sm-10"><input type="password" class="form-control" id="password"></div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-success">登录</button>
                    <button type="submit" class="btn btn-default">注册</button>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    $('#loginBox').click(function () {
        $('#loginBox').hide();
    });
    $('#loginBody').click(function (f) {
        f.stopPropagation();
    });
</script>