Javascript 视频在Opera中播放,但皮肤不是选项中定义的(并且它在Firefox中不播放)

Javascript 视频在Opera中播放,但皮肤不是选项中定义的(并且它在Firefox中不播放),javascript,video.js,dynamically-generated,Javascript,Video.js,Dynamically Generated,我正在开发一个带有弹出窗口的页面,以显示选定的视频。 我使用引导,视频显示在模式对话框中 问题是,即使我将皮肤定义为vjs tech(或默认的视频js vjs默认皮肤),显示的皮肤也是白色的。 在Firefox中,显示皮肤,但浏览器不播放视频 视频是h264格式,音频是aac格式(它是一个流) 模式弹出窗口的网页代码为: <div class="modal fade" id="myModalAstraPlayer" tabindex="-1

我正在开发一个带有弹出窗口的页面,以显示选定的视频。 我使用引导,视频显示在模式对话框中

问题是,即使我将皮肤定义为vjs tech(或默认的视频js vjs默认皮肤),显示的皮肤也是白色的。 在Firefox中,显示皮肤,但浏览器不播放视频

视频是h264格式,音频是aac格式(它是一个流)

模式弹出窗口的网页代码为:

<div class="modal fade" id="myModalAstraPlayer" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog videocenter" id="videocontainer">
        <div class="modal-content">
            <div class="modal-body">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <div style="width:560px; height:340px;" id="videoplayer">

                </div>
            </div>
        </div>
    </div>
</div>
任何人都可以提供一些示例代码或有关问题的线索

Opera弹出窗口:

Firefox弹出窗口:

包含“视频”标记的html在哪里?它是由video=document.createElement(“视频”)动态生成的;然后填充了和videojs相关的元素。啊,是的。我现在看到了。因此,我的想法是,在class属性中需要一个额外的标记。尝试包含一个“video js”标记。[在我的工作示例中,我的class属性有2个标记:class=“video js vjs default skin”标记由“space”字符分隔。]
    var video;

    var videoaddress = document.getElementById("videoaddress").value;
    channelname = row.output;
    var n = channelname.lastIndexOf('/');
    var result = channelname.substring(n + 1);
    var videotoshow = videoaddress + "/" + result; // this is the video address...

    var mainDiv = document.getElementById('videoplayer');

    var divContainer = document.createElement('div');
    divContainer.class = 'example-video-container';
    divContainer.style.display = 'inline-block';
    divContainer.id = "videodiv";
    mainDiv.appendChild(divContainer);

    // Create Video Player
    video = document.createElement('video');
    video.id = 'vid2';
    video.width = 560;
    video.height = 315;
    video.autoplay = true;
    video.controls = true;
    video.muted = false;
    video.preload = 'auto';
    video.poster = "../images/loading.jpg";
    video.setAttribute("example_option", "true");
    video.setAttribute("playbackRates", "[1, 1.5, 2]");
    //video.setAttribute("controlspreload", "none");
    video.setAttribute("class", "vjs-tech"); //video-js vjs-tech video-js vjs-default-skin");

    function addSourceToVideo(element, src, type)
    {
        var source = document.createElement('source');
        source.src = src;
        source.type = type;
        element.appendChild(source);
    }

    addSourceToVideo(video, videotoshow, 'video/mp4');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="avc1.58A01E, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="avc1.4D401E, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="avc1.64001E, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="mp4v.20.8, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp4; codecs="mp4v.20.240, mp4a.40.2"');
    //addSourceToVideo(video, videotoshow, 'video/mp2t');
    //addSourceToVideo(video, videotoshow, 'video/mpeg');
    //addSourceToVideo(video, videotoshow, 'video/msvideo');
    //addSourceToVideo(video, videotoshow, 'video/3gpp');
    //addSourceToVideo(video, videotoshow, 'video/3gpp2');
    //addSourceToVideo(video, videotoshow, 'video/avi');
    //addSourceToVideo(video, videotoshow, 'video/mpeg');
    //addSourceToVideo(video, videotoshow, 'video/msvideo');
    //addSourceToVideo(video, videotoshow, 'video/quicktime');
    //addSourceToVideo(video, videotoshow, 'application/octet-stream');

    console.log("Video Creation End");
    console.log("Paragraph Started");

    var paragraph = document.createElement('p');
    paragraph.innerHTML = "Video PlayBack Not Supported";
    video.appendChild(paragraph);
    divContainer.appendChild(video);

    $("#div_video_html5_api").show(); // Not necessary?

    video.load();
    video.play();

    $('#myModalAstraPlayer').modal('show');

    jQuery('#myModalAstraPlayer').on('shown.bs.modal', function (e)
    {

    });

    jQuery('#myModalAstraPlayer').on('hidden.bs.modal', function (e)
    {
        video.pause();
        videojs(video).dispose();

        try
        {
            document.getElementById("videodiv").remove();
        }
        catch(err)
        {
            console.log(err.message);
        }
    });

    var myVideo = document.getElementById("vid2");

    // disable right-click over video...
    if (myVideo.addEventListener)
    {
        myVideo.addEventListener('contextmenu', function(e)
        {
            e.preventDefault();
        }, false);
    }
    else
    {
        myVideo.attachEvent('oncontextmenu', function()
        {
            window.event.returnValue = false;
        });
    }