点击a元素显示对应的div,点击其他地方隐藏div或者显示对应div用js控制怎么写?为啥alert()没有输出?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了点击a元素显示对应的div,点击其他地方隐藏div或者显示对应div用js控制怎么写?为啥alert()没有输出?相关的知识,希望对你有一定的参考价值。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>工作</title>
<style type="text/css">
.details
border: 1px green solid;
height: 300px;
background-color: yellow;
display:none;

</style>
<script type="text/javascript">
window.onload=function()
var details=document.getElementsByClassName("details");
for (var i=0;i<details.length;i++)
details[i].previousSibling.onclick=function()
alert(this.nextSibling.style.display);
if(this.nextSibling.getAttribute("style.diply")==null)
this.nextSibling.style.display="block";

else
this.nextSibling.style.display="none";

;

</script>
</head>

<body >
<div id="header">
</div>
<div id="content">
<ul class="ul-row">
<li><a>财务</a><div id="0" class="details" >02222</div></li>
<li><a>人事</a><div id="1" class="details">1</div></li>
<li><a>行政</a><div id="2" class="details">2</div></li>
</ul>
<ul class="ul-row">
<li id="0sds"><a id="a3" >生产</a><div id="3" class="details">3</div></li>
<li><a>餐饮</a><div id="4" class="details">4</div></li>
<li><a>建设</a><div id="5" class="details">5</div></li>
</ul>
<ul class="ul-row">
<li><a>送快递</a><div id="6" class="details">6</div></li>
<li><a>销售</a><div id="7" class="details">7</div></li>
<li><a>表演</a><div id="8" class="details">8</div></li>
</ul>
</div>
<div id="footer">
</div>
</body>

</html>

用document的onmousedown 响应鼠标在页面上的点击事件 IE中用event.srcElement; FF中用e.target; 能获得鼠标点击的对象 然后你判断该对象是否为选择城市的这个div 不是的话就隐藏该 div 我想怎么用jquery你应该知道 吧 $(document).mousedown( function(event) alert(event.target.id); //这样会弹出你单击的元素的id,你可以在这里写你的程序了 ); ); 参考技术A

引入jquery.js会比较好写点

$(function()
    $('a').click(function()
        $('#header').hide();
    );
);

以上是关于点击a元素显示对应的div,点击其他地方隐藏div或者显示对应div用js控制怎么写?为啥alert()没有输出?的主要内容,如果未能解决你的问题,请参考以下文章

js实现点击显示一个div,点击其他任何地方div消失,如何实现

jq 点击按钮显示div,点击页面其他任何地方隐藏div

Jquery点击除了指定div元素其他地方,隐藏该div

jQuery点击div其他地方隐藏div

js隐藏div

实现点击页面其他地方,隐藏div(vue)