gpt4 book ai didi

jquery - div 点击事件不起作用

转载 作者:行者123 更新时间:2023-12-01 02:03:16 24 4
gpt4 key购买 nike

我有这个简单的代码,在正文中附加一个 div,

<!DOCTYPE html>
<html>


<head>
<script type="text/javascript" src='/libs/jquery/jquery.js'></script>
<script>
$(document).ready( function() {
$('#show').click( function() {
$("<div id='fade'></div>").appendTo('body');
$('#fade').fadeIn('fast');
});

$('#fade').click( function() {
$('#fade').remove('fast');
});
});
</script>
</head>

<body>
<div>
<input type="button" value="show" id="show"/>
</div>
</body>
</html>

CSS

#fade {
display: none;
background: black;
opacity:0.4;
filter:alpha(opacity=50);
z-index: 1;
position: fixed;
left: 0; top: 0;
width: 100%; height: 100%;
}

#window {
width: 440px;
height: 356px;
background: white;
position:fixed;
left:50%;
top:30%;
margin:-70px 0 0 -245px;
z-index: 2;
}

附加我的 div#fade 工作正常,但我在 #fade 上的点击事件不起作用。我看起来很简单,但我不知道为什么不能正常工作。

最佳答案

工作解决方案位于 http://jsfiddle.net/ffK3u/1/

$(document).ready( function() {
$('#show').click( function() {
$("<div id='fade'></div>").appendTo('body');
$('#fade').fadeIn('fast');
});

$(document).on("click","#fade", function() {
$('#fade').fadeOut("slow",function(){
$('#fade').remove();
});
});
});

关于jquery - div 点击事件不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11665561/

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