jq点击按钮打开和关闭弹出层,点击除了当前按钮以外的地方关闭弹出层


1.html

<a id="more" onclick="moreFun()">更多</a>
<ul id="moreList" style="display:none">
    <li>列表1</li>
    <li>列表2</li>
    <li>列表3</li>
</ul>

2.实现点击更多按钮弹出moreLise列表,点击页面其他地方关闭moreLise列表,js代码如下:

//使用toggle方法实现列表的展开和关闭
function moreFun(){
       $("#moreList").toggle(); 
}
//点击页面其他地方关闭
document.onclick = function (e) {
       //判断点击的地方是否为“更多”按钮和弹出层是否显示
	if(!$(e.target).is(".more") && $("#moreList").is(":visible")==true){
		$("#moreList").hide();
	}
}

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM