OOP 访问 html5 视频变量答案

【问题标题】：OOP access to html5 video variablesOOP 访问 html5 视频变量
【发布时间】：2014-10-14 10:28:07
【问题描述】：

在 OOP 中我无法访问 html5 视频的 currentSrc 变量。

if (typeof vidPlayer === "undefined") {
var vidPlayer = {};
}
vidPlayer.videoObj = $('video');
vidPlayer.videos_list = [{
        'id': 0,
        'name': '01_Main_entrance.mp4'
    }, {
        'id': 1,
        'name': '03_Meeting_of_zones.mp4'
    }, {
        'id': 2,
        'name': '04_Goods_entrance.mp4'
    }, {
        'id': 3,
        'name': '05_Tissue_cultures.mp4'
}];

vidPlayer.changeVideo = function(selector) {
    console.log(this.videoObj);
    console.log(this.videos_list);
    var url = vidPlayer.videoObj[0].currentSrc;
    var url_arr = url.split('/');
    var file_name = url_arr[url_arr.length - 1];

    for (var i = 0; i < vidPlayer.video_list.length; ++i) {
        if (vidPlayer.video_list[i].name == file_name) {
            if ($(selector).attr('class') == 'next') {
                var id = carousel(vidPlayer.video_list[i].id,vidPlayer.video_list.length - 1,'+');
                var source = 'videos/' + vidPlayer.video_list[id].name;
                loadVideo(source);
            }
            if ($(selector).attr('class') == 'prev') {
                var id = carousel(vidPlayer.video_list[i].id,vidPlayer.video_list.length - 1,'-');
                if (vidPlayer.video_list[i].id == 0) {
                    var id = vidPlayer.video_list.length - 1;
                } else {
                    var id = vidPlayer.video_list[i].id - 1;
                }
                var source = 'videos/' + vidPlayer.video_list[id].name;
                loadVideo(source);
            }
        }

    }
}

所以我无法访问属性 currentSrc 并且我得到：Uncaught TypeError: Cannot read property 'currentSrc' of undefined.

【问题讨论】：

我添加了更多代码。
在文档就绪函数thnx中启动对象后现在工作正常

标签： javascript jquery html oop

【解决方案1】：

问题可能是您在将vidPlayer 对象加载到您的结构之前定义了它的所有属性。这是因为您的 script 包含在 html 的相关部分之前。您需要在文档就绪事件中定义事件，甚至在稍后运行的事件中定义事件，具体取决于您如何生成 html。基本上，您必须确保在您的 html 中已经存在 $('video') 时调用它。

【讨论】：