<div class="moudle_list" id="moudle_list">
<ul id="listmoudle">
<li><div class="box_num">编号:11</div><div class="Recommend">推荐(0)</div><div class="box_hot">人气:<span>222</span></div><div class="moudle_case"><h1><a href="#">实际演示</a></h1><h2><a href="#">查看案例</a></h2></div></li>
<li><div class="box_num">编号:22</div><div class="Recommend">推荐(0)</div><div class="box_hot">人气:<span>333</span></div><div class="moudle_case"><h1><a href="#">实际演示</a></h1><h2><a href="#">查看案例</a></h2></div></li>
<li><div class="box_num">编号:33</div><div class="Recommend">推荐(0)</div><div class="box_hot">人气:<span>444</span></div><div class="moudle_case"><h1><a href="#">实际演示</a></h1><h2><a href="#">查看案例</a></h2></div></li>
</ul>
</div>
这有一组div下ul标签和li标签组。
$("#moudle_list li").mouseover(function(){
$(this).attr("id","mouse_on");
$(this).children(".moudle_case").css("display","block");
}).mouseleave(function(){
$(this).removeAttr("id");
$(this).children(".moudle_case").css("display","none");
});
这段js是控制之前html页面li的显示样式。但是我用下面这段代码清空之后,再添加同样的li内容,这段样式就不显示了。是不是因为之前li是属于ul或者div的child节点,然后清空再添加之后,就没有这层关系了?那要怎么样添加才可以正常显示?
$("#listmoudle").empty();;
$("#listmoudle").append(str);
str内容和上面html代码ul里的li内容完全一样。
------解决方案--------------------
我又看了下。。这个还要看是jquery哪个版本。给你两个方法。自己试吧。。哪个能用就用哪个。
想了解更多就看jquery的官方api文档
http://api.jquery.com/category/events/
$("#moudle_list").on("mouseover", "li", function(){
$(this).attr("id","mouse_on");
$(this).children(".moudle_case").css("display","block");
});
$("#moudle_list li").delegate("mouseover", function(){
$(this).attr("id","mouse_on");
$(this).children(".moudle_case").css("display","block");
});