如何使用ajax调用将类添加或绑定到动态加载数据的父元素和子元素？答案

【问题标题】：How to add or bind classes to both parent and child elements of dynamically loaded data using ajax call?如何使用ajax调用将类添加或绑定到动态加载数据的父元素和子元素？
【发布时间】：2015-05-12 06:10:45
【问题描述】：

我是 jQuery 新手，过去 1 周一直在这里苦苦挣扎。我正在使用 ajax 调用从 JSON 数组加载数据，并使用一个“滑动”插件在我的页面上滑动并加载所有图像分区。但我不知道如何将类添加到父 div 和子元素。我的代码是：

    url : "http://my_ip/App/event_h/get_a_evnts",
    type:"POST",
    dataType:"json",
    success: function(data)
    {
        var event1=data.event1;
        var total_event=event1.length;
        var event1=data.event1;
        var DOM=$('#DOM');
        var path="http://my_ip/App/";
        var media1=data.media;
        var location=json.location; 
        var event2=data.event;
        var rating=data.rating;
        var event1[i].event_id =1;//this value also retrived from json array
        var output= '<div class="container-fluid" ><section class="row">';
            output +='<div class="col-sm-12 col-md-12 col-xs-12"><div class="panel panelstyle">';
            output +='<header><h1><small>Event : </small>'+event1[i].event_title+'</h1></header><div class="panel-body">';
            output +='<div id="div1" class="swiper-container" ><div  id="div2" class="swiper-wrapper"  >';
              for(j=0; j<media1.length; j++) {
                if(event1[i].event_id === media1[j].event_id){
                 output +='<img id="newimg" class="swiper-slide" src='+path+media1[j].media_path+' alt="new image" />';
                }
              }});

我没有在这里写完整的代码，只是需要的部分我也写了在上面的代码中，一切正常，即使控制台中没有一个错误，但 .swiper-container、.swiper-container、.swiper-slide 在页面加载时没有加载，所以我无法滑动我的图像。我尝试过“on”、“delegate”和“bind”，但在页面加载时无法附加这些类。

【问题讨论】：

这是你的完整代码吗？
为动态添加元素绑定滑动事件，或者在ajax成功后调用它
不，不是。我正在获取大量数据，并且在上面我已经编写了代码来检索一些属于我想使用 swiper 插件滑动的某个类别的图像。但我不知道如何绑定课程..
请提供您使用过的插件的链接
插件是什么（可能是链接？），它在哪里定义/初始化？

标签： javascript jquery css ajax swiper

【解决方案1】：

试试这个代码：

output = $(output);
output.addClass(".swiper-container");

【讨论】：

【解决方案2】：

您所指的父元素不一定是直接父元素，它可以是文档准备就绪时存在的任何元素，并且您必须绑定事件的元素是它的后代。在最坏的情况下，有身体元素。

或

将动态创建的html插入页面后，您可以在成功函数中添加幻灯片事件。

【讨论】：