jq 點擊按鈕顯示div,點擊頁面其他任何地方隱藏div

css

　　　　　　　.bl_rencai_32{
                float: left;
                height: 35px;
                line-height: 35px;
            }
            .bl_rencai_32 >input{
                width: 30px;
                height: 18px;
                padding: 0px 5px;
                margin-top: -3px;
            }
            .bl_rencai_32 a{
                display: none;
                background-color: #FF6600;
                text-align: center;
                padding: 3px 8px;
                color: #fff;
                border-radius: 3px;
                margin-left: 10px;
            }
            .bl_rencai_32 a:hover{
                background-color: #ff552e;
            }

 

html

　　　　　　　　　　　　　　<div class="bl_rencai_32">
				<input type="text" name="" value="">
				<span>-</span>
				<input type="text" name="" value="">
				<span>歲</span>
				<a href="" class="bl_rencai_32_ashow">篩選</a>
			</div>

　　

 

jq

/*輸入年齡段 點擊顯示 篩選按鈕 並 點擊其他地方時篩選按鈕隱藏*/
        $('.bl_rencai_32 input').on('click',function(e){
            $('.bl_rencai_32_ashow').show();
            $(document).one('click',function(){
                $('.bl_rencai_32_ashow').hide();
            })
            e.stopPropagation();/*stopPropagation();方法可以阻止把事件分派到其他節點*/
        })

 

 

借鑒網址：https://blog.csdn.net/YangBingX/article/details/78644486  （他的這里面有原生JS的方法）