jquery 点击标题弹出内容和遮罩层后，点击关闭按钮怎么关闭

Posted 2023-03-09

<div id="layer"></div>
<div class="pop_box">
<dl>
<dt>标题1</dt>
<dd class="box">内容1<a href="#" class="close">关闭</a></dd>
</dl>
<dl>
<dt>标题2</dt>
<dd class="box">内容2<a href="#" class="close">关闭</a></dd>
</dl>
</div>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function()
$('.pop_box dl').click(function ()
var text = $(this).find('dd').show();
$('#layer').show()
);
);
</script>

<style type="text/css">
* margin:0; padding:0;
.pop_box position:relative ;
.pop_box dl dt width:150px; float:left;
.box width:500px; height:300px; background:#fff; border:2px solid #ddd; position:fixed;z-index:2; left:30%; top:30%; display:none;
#layer width:100%; height:100%; position:fixed; background:#ff0000; left:0; top:0; z-index:1; position:absolute; left:0; top:0; display:none; filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;
.close width:60px; height:30px; line-height:30px; background:#ff0000; color:#fff; display:block; text-align:center; margin:100px auto;
</style>

$(".close").click(function()
$(this).parent("dd").hide();
$('#layer').hide();
)

追问

加上了，还关闭不了

追答

你这个问题很奇怪啊，一开始说我还不信，去试了一下，确实不好使，在我其他项目都好使，你这样，先用：

$(".close").click(function()
$(this).parent("dd").fadeOut();
$('#layer').fadeOut();
)

这个也会使他消失，但有个特效，你不想要可以在fadeOut()里面填个0，变成：fadeOut(0)

修改：

上面说的作废你改成hide(1)，这个我也不知道为啥，反正设成1毫秒内执行完毕就行了……

参考技术A 你需要写个关闭的函数啊，使用.hide（）函数追问

求帮忙写下，我写半天总是关闭不了