gpt4 book ai didi

javascript - 如何创建自定义模式弹出窗口 - 以及如何在其外部单击关闭它

转载 作者:行者123 更新时间:2023-11-29 10:43:57 24 4
gpt4 key购买 nike

<分区>

<a href="javascript:void(0)" onclick = "document.getElementById('light3').style.display='block';document.getElementById('fade').style.display='block'"><button type="button" name="" value="" id="readmorelink3">+<span class="rmore">Read More</span></button></a>

我正在使用上面的 DOM 经典 onClick 将 div 简单地显示为一个简单的弹出窗口。我在 div 中创建了一个关闭按钮,但我也希望在用户单击 body 或任何不是打开的 div 时打开 div hide。我已经尝试了一切——

我的简单叠加层(第 1 个,共 3 个)

<!-- read more overlays 1 -->

<div id="light" class="white_content">

<a class="close" href="javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" class="textright" style="color: #DDD !important; float:right;">CLOSE X</a>

<h4>[Hey+]</h4>
<h3>Demo</h3>
<h3>SUP</h3>
<span> 2.5 fl. oz.</span><br>
<br>
<p>
Cool content, about cool things.
</p>

</div>

<!-- // read more overlays 1-->

我试过这个人:

$(document).click(function() {
$('#mydiv').fadeOut(300);
});

我惹上了这个人:

 if($('#mydiv').is(":not(:visible)") ){

//如果可见等反之亦然


也试过了。

 // To prevent hide #menu when click on #main
$('#mydiv').click(function (e) {
e.stopPropagation();
});

// Click outsite of #menu
$('html').click(function () {
$('#mydiv').hide();
});

意识到我应该用简单的 jQuery 而不是内联来完成这个;但我不想重做所有事情,所以寻求 DOM/JavaScript 解决方案。只需关闭打开或显示:阻止 div > 当它们显示时,通过另外单击元素外部或 body 标签。

EG:显示 DIV 覆盖 > 在元素外部单击并关闭。我在 BODY 标签上添加了点击关闭按钮,但它完全关闭了弹出窗口,添加了一个包装器,没有雪茄。

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com