今天在对接网站数据时,发现个bug,就是我动态添加的元素没办法直接使用它的事件;
点击左边的年份,切换具体的期数;
$(".menu-ul").empty();//清空该元素下面的子元素
for( var i = 1 ; i <= month; i ++ ){
var li = "<li value='"+i+"'>"+year+"年第"+i+"期</li>";
$(".menu-ul").append(li);//根据取得的year、month动态添加期数元素
}
然后点击相应期数,显示不同期数的内容;
$(".menu-ul li").click(function(){
//获取相应的年份和期数,再通过ajax获取数据,显示数据
});
那么问题来了,我动态添加的元素(li)找不到click事件,去百度了下,找到了解决办法,就是使用jquery的.on()函数:
on()支持直接在目标元素上绑定事件,也支持在目标元素的祖辈元素上委托绑定。在事件委托绑定模式下,即使是执行on()函数之后新添加的元素,只要它符合条件,绑定的事件处理函数也对其有效。
所以对自己的点击事件代码做了以下修改:
$(".menu-ul").on("click","li",function(){
//获取相应的年份和期数,再通过ajax获取数据,显示数据
});