HTML弹出的DIV怎么关闭？

发布网友发布时间：2022-04-20 20:13

共4个回答

热心网友时间：2023-12-17 23:11

var 按钮=document...;
var div=document....;

//点击按钮弹出div 在点击按钮关闭该div
按钮.onclick=function()
{
if(div.style.display=="none")
{
div.style.display="block";
}
else
{
div.style.display="none";
}
}

//点击其他地方关闭div
document.onclick=function()
{
div.style.display="none";
}

//为了防止点击div 也关闭div 所以这里要防止冒泡
div.onclick=function()
{
return false;
}

希望对你有所帮助

热心网友时间：2023-12-17 23:11

<html>
<head>
<script type="text/javascript">
var arr=null;
function ckThis(){
    var createDiv = document.createElement("div");
    createDiv.style.left = 300;
    createDiv.style.top = 300;
    createDiv.style.height = 50;
    createDiv.style.width = 50;
    createDiv.style.position = 'absolute';
    createDiv.style.border = '1px dotted #AAAAFF';
arr = createDiv;
    window.document.body.appendChild(arr);
}
function clThis(){
arr.parentNode.removeChild(arr);
};
</script>
</head>
<body>
    <input type="button" value="按钮" onclick="ckThis();"/>
<input type="button" value="取消" onclick="clThis();" />
</body>
</html>

直接给你代码了，具体实现什么功能，可以在这个基础上扩展

热心网友时间：2023-12-17 23:12

让我来。。
由于百度要的答案不能有网址，不然会被屏蔽的，下面代码src中写下列网址：http：//code@jquery@com/jquery-1.10.2@js
把@换成.

<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src=""></script>
</head>
<script>
$(document).ready(function() {
$("#obj").hover(
function(){$(this).css('display', 'block');},
function(){$(this).css('display', 'none');}
);
$(".control").click(function(){
$("#obj").toggle();
})
});
</script>
<body>

<div id="obj" style="background-color:red;border:2px solid #666;height:300px;">其他内容</div>
<div class="control"><input type="button" value="我是按钮么"/></div>
</body>
</html>

热心网友时间：2023-12-17 23:12

设置style="display:none/block"属性试试追问嗯，点击按钮来显示隐藏实现了但是点击其他区域也能关闭div要怎么判断呢？