Question

在bootstrap模式中加载动态内容

我创建了bootstrap模式，通过json对象显示youtube iframe

HTML

<div class="modal fade" data-id="" id="myModal" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <div class="modal-body">
                <iframe id="iframe" src="" class="video-demntion"></iframe>
            </div>
        </div>
    </div>
</div>

从框架

加载i帧

if(msg.msg_type=="video"){
                var imgList= "";
                $.each(msg.video.videos, function(index){
                     $('#iframe').attr('src','https://www.youtube-nocookie.com/embed/' + this.video_id);
                    console.log("data-id : " + this.id );                       
                    imgList += '<li><a class="openBtn" data-target="#myModal" data-toggle="modal" data-id="' + this.id +'"><img src= "' + this.thumbnail_2 + '"></a></li>';
                    console.log(this.video_id);                     
                });
                $('#messages').append(imgList);
            }else{
                console.log(msg);
            }

JSON

Video:[videos:[{id: "23",video_id: "xa-4mQtwasI",},{id: "24",video_id:"trgr0Ya6D24",}]]

Jquery Onclick Funtion

$("a").click(function(){
                    $('#iframe').attr('src','https://www.youtube-nocookie.com/embed/' + this.video_id);
                    $('#myModal').attr('data-id',this.id);
                    alert(this.video_id);
                    $("iframe").each(function(){
                        $(this).attr("src", $(this).data("src"));
                    });
                    $('#myModal').modal('show');
                });

点击锚点需要准备模态基本上，代码没有触发点击功能，因为已经创建了dom我想强制类动态绑定它，从这段代码只有最后一个视频在所有模态中呈现。请纠正我出错的地方

在bootstrap模式中加载动态内容

在bootstrap模式中加载动态内容

0 个答案: