Jquery Expand-Collapse无法在AJAX中成功运行

我被这个问题困住了。我在jQuery中有一个

AJAX

，在

success

的内部，我制作了一个HTML标记，并将其附加到jQuery功能之外的HTML中。我的问题是，我将附加到的HTML标记将展开和折叠。我不知道当我在html标记中应用类名时，它为什么没有展开和折叠是什么问题

以下是我的javascript：

<script type="text/javascript">
$(document).ready(function()
    {
        $('ul.group').delegate('a', 'click', function(event) {
        if ($(event.target).next().is(':visible')) {
            $(event.target).next().find('ul').slideUp(250, function() {
                $(event.target).next().slideUp(250);
            });
        } else {
            $(event.target).parent().siblings().find("ul").slideUp(250);
            $(event.target).next().slideDown(250);
        }
    });
});
</script>

这是我的html：

<div id="stage">

</div>

下面是我的jQuery AJAX：

$( "#search_batch_structure" ).click(function(e)
    {
        e.preventDefault();

        $.ajax({
        url : '<?php echo base_url()?>project/search_project_structure_stage',
        type: 'POST',
        data: { 
                project_id: $('#project_id').val()
              },
        success : function(stages)
                {
                    var stages = $.parseJSON(stages);
                    for (var i = 0; i < stages.length; i++)
                    {
                        stageID = stages[i].ID;
                        stagename = stages[i].StageName;
                        stageorder = stages[i].ordStage;

                        var html_stage = "<ul id='"+stageID+"' class='group'><li class='plusimageapply'><a onclick='return false;'>" + stagename + "&nbsp;" + stageorder + "</a>";
                        $('#stage').append(html_stage);

                        $.ajax({
                        url : '<?php echo base_url()?>project/search_project_structure_batch',
                        type: 'POST',
                        data: { 
                                'stage_id': stageID,
                              },
                        success : function(batch)
                                {
                                    var batch = $.parseJSON(batch);
                                    for (var i = 0; i < batch.length; i++)
                                    {
                                        batchID = batch[i].BatchID;
                                        batchname = batch[i].BatchName;
                                        batchorder= batch[i].ordBatch;
                                        stageid = batch[i].StageID;

                                        var html_batch = "<ul id='"+batchID+"' class='group'><li class='plusimageapply'><a onclick='return false;'>" + batchname + "&nbsp;" + batchorder + "</a>";
                                        $('#'+stageid).append(html_batch);

                                        $.ajax({
                                        url : '<?php echo base_url()?>project/search_project_structure_activity',
                                        type: 'POST',
                                        data: { 
                                                'batch_id': batchID,
                                              },
                                        success : function(activity)
                                                {
                                                    var activity = $.parseJSON(activity);
                                                    for (var i = 0; i < activity.length; i++)
                                                    {
                                                        activityID = activity[i].ActivityID;
                                                        activityname = activity[i].ActivityName;
                                                        activityorder = activity[i].ordActivity;
                                                        batchid = activity[i].BatchID;
                                                        var html_batch = "<ul><li class='selectedimage'>" + activityname + "&nbsp;" + activityorder + "</li></ul></li></ul></li></ul>";
                                                        $('#'+batchid).append(html_batch);
                                                    }


                                                }
                                        });
                                    }


                                }
                        });
                    }
                }
        });
    });

$（“#搜索_批次_结构”）。单击（函数（e）
{
e、 预防默认值（）；
$.ajax({
url:'项目/搜索\项目\结构\阶段'，
键入：“POST”，
数据：{
项目id:$（'#项目id'）.val（）
},
成功：功能（阶段）
{
var stages=$.parseJSON（stages）；
对于（变量i=0；i
“+stagename+”“+stageorder+”；
$（'#stage'）.append（html#u stage）；
$.ajax({
url:“项目/搜索\项目\结构\批处理”，
键入：“POST”，
数据：{
“阶段id”：阶段id，
},
成功：功能（批处理）
{
var batch=$.parseJSON（batch）；
对于（变量i=0；i
“+batchname+”“+batchorder+”；
$（'#'+stageid）.append（html#u批处理）；
$.ajax({
url:'项目/搜索\项目\结构\活动'，
键入：“POST”，
数据：{
“批次id”：批次id，
},
成功：职能（活动）
{
var activity=$.parseJSON（activity）；
对于（变量i=0；i
”+activityname+“+activityorder+”
”；
$（'#'+batchid）.append（html#u批处理）；
}
}
});
}
}
});
}
}
});
});

我在想，如果它不起作用，因为它只是附加？

---

有人能帮我吗？

看起来您正在将事件处理程序委托给另一个也动态生成的元素。您需要将处理程序绑定到未动态添加的元素

而不是

$('ul.group').delegate('a', 'click', function(event) {

})

试一试

---

如果AJAX调用的success函数正在添加您的

ul.group

元素，则在加载页面时无法将委托事件处理程序绑定到这些元素。相反，您需要将事件处理程序绑定到确实存在的元素（即

#stage

）：

另一方面，如果您使用的是jQuery 1.7+，则应该使用委派事件形式

.On（）

：

$('#stage').on('click', 'ul.group a', function(e) {
    // code
});

---

在上使用

不是强制性的。据我所知，委托并没有被弃用，它仍然适用于查询的最新版本。只有
live（）
不推荐使用。@TJ
.on（）
是目前推荐的方式。我知道。然后你应该说“推荐使用”左右。否则它听起来就好像不存在了，你不能使用1.7以上的语法…@TJ就我而言，我写的和你认为我应该写的完全一样。我用了“应该”这个词——这是一个建议，这是一个更可取的方法——而不是“必须”这个短语，这意味着他们绝对不能使用
.delegate（）
@user987654321尝试从
“
$(document).delegate('ul.group a', 'click', function(event) { //or any other element that stays in page

});

$('#stage').delegate('ul.group a', 'click', function(e) {
    // your logic here
});

$('#stage').on('click', 'ul.group a', function(e) {
    // code
});