AddChapter上本该有点击事件的。可是js动态生成的元素上却没有
$(function(){
$(".RightContentImg").parent().siblings("div").not(".RightContentImgAdd").css("display","block");
$(".AddChapter").on("click",function(){
var div = '<div class="FormItemListEdit" id="FormItemListEditCollapse">'+
'<a href="javascript:void(0)"><p class="EditContent">'+
'<a href="javascript:void(0)" class="EditContentImg"></a>准备工作</p></a>'+
'<a href="javascript:void(0)" class="RightContentImg"></a>'+
'<div class="RightContentImgAdd"><div class="Entry"><div class="EntryTrangle"></div>'+
'<a class="AddChapter"href="javascript:void(0)"><p>添加章</p></a>'+
'<a class="AddSection" href="javascript:void(0)"><p>添加节</p></a>'+
'<a class="DeleteColumn"href="javascript:void(0)"><p>删除</p></a></div></div>'+
'<a href="javascript:void(0)" class="RightContentNum">0字</a></div>';
$("#FormItemListEditCollapse").parent().append(div);
});
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<a class="AddChapter" href="javascript:void(0)"><p>添加章</p></a>
<div id="FormItemListEditCollapse"></div>
<script>
$(document.body).on('click', '.AddChapter', function () {
var div = '<div class="FormItemListEdit" id="FormItemListEditCollapse">' +
'<a href="javascript:void(0)"><p class="EditContent">' +
'<a href="javascript:void(0)" class="EditContentImg"></a>准备工作</p></a>' +
'<a href="javascript:void(0)" class="RightContentImg"></a>' +
'<div class="RightContentImgAdd"><div class="Entry"><div class="EntryTrangle"></div>' +
'<a class="AddChapter"href="javascript:void(0)"><p>添加章</p></a>' +
'<a class="AddSection" href="javascript:void(0)"><p>添加节</p></a>' +
'<a class="DeleteColumn"href="javascript:void(0)"><p>删除</p></a></div></div>' +
'<a href="javascript:void(0)" class="RightContentNum">0字</a></div>';
$("#FormItemListEditCollapse").parent().append(div);
})
</script>
你可以试试 $(".addChapter").click(function(){
//TODO
});
可能你引入的jquery版本的问题,有些版本存在这种情况1.9 2.0 2.1 貌似都存在
执行这句$(".AddChapter").on只能获取dom中已经存在的元素,后续添加没搞。。应该给parent添加事件,然后指定选择器
$(".AddChapter的容器选择器").on("click",'.AddChapter',function(){
$(".AddChapter的容器选择器").off(".AddChapter的容器选择器").on("click",'.AddChapter',function(){
初始化页面的时候,js会给你的标签绑定监听事件,而新生成的标签没有绑定监听事件,因此点击之后无法触发js,这时候需要使用jquery事件delegate()方法来解决,具体写法:$( AddChapter容器的父元素 ).delegate( '.AddChapter', click,function(){
//do something
} ),注意它是绑定到AddChapter的父元素上的