解决Jquery使用append追加后的内容事件无效

最新推荐文章于 2021-06-17 18:11:39 发布

大毛啊

最新推荐文章于 2021-06-17 18:11:39 发布

阅读量1.8k

点赞数

分类专栏： Jquery 文章标签： jQuery事件无效

大毛啊

本文链接：https://blog.csdn.net/s1101356835/article/details/102642213

版权

Jquery 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

学习记录，仅供参考！

详细内容写在代码注释上了

HTML

<body>
		<button type="button" class="moreBtn">点击后加载更多的li</button>
		<ul class="oUl">
			<li class="btnLi">1</li>
		</ul>
	</body>

<script type="text/javascript">
		$(function(){
			//点击按钮向ul追加li
			$('.moreBtn').on('click',function(){
				for (var i = 2; i < 10; i++) {
					$('.oUl').append('<li class="btnLi">'+i+'</li>');
				}
			})
			//使用on()方法通过父类给子元素添加点击事件(适用html加载完成后添加的dom元素)
			$('.oUl').on('click','.btnLi',function(){
				alert()
			});
		});
	</script>