Youtube API和javascript问题

Youtube API和javascript问题,javascript,jquery,youtube,youtube-api,Javascript,Jquery,Youtube,Youtube Api,我知道这里一定是个贫民窟,但我正在想办法让我的youtube链接以某种时尚的方式显示在我的主页上。我厌倦了在youtube上发布一些东西,然后在我的网站上创建一个帖子,基本上是youtube帖子的复制品。也许已经有一些东西内置了这个功能,但到目前为止我还没有看到它。我有几个问题要问到目前为止我正在努力实现的目标: 如何更新代码,以便在youTubeMe对象中使用“this”,从而引用变量名。我很确定我明白为什么我不能使用它,但我不知道如何修复 其次,谷歌api对我来说似乎有点奇怪。我对使用iFr

我知道这里一定是个贫民窟,但我正在想办法让我的youtube链接以某种时尚的方式显示在我的主页上。我厌倦了在youtube上发布一些东西,然后在我的网站上创建一个帖子,基本上是youtube帖子的复制品。也许已经有一些东西内置了这个功能,但到目前为止我还没有看到它。我有几个问题要问到目前为止我正在努力实现的目标:

  • 如何更新代码,以便在youTubeMe对象中使用“this”,从而引用变量名。我很确定我明白为什么我不能使用它,但我不知道如何修复

  • 其次,谷歌api对我来说似乎有点奇怪。我对使用iFrame不太感兴趣,为了获得VideoId而必须执行的分割操作也不正确

  • 如有任何建议,将不胜感激。我将发布代码,但您也可以找到一个工作示例

  • HTML:


    您应该做的是创建一个闭包,并将所有内容都包含在其中。您可以这样做:

    //a closure function that calls itself
    (function(){
    
        //with var it would be private and not accesable like this: 
        //youTubeMe.pageSize
        var pageSize = 10;
    
        //declare a global reference to the youTubeMe object
        var youTubeMe = window.youTubeMe = function(){
    
        };
    
        //with youTubeMe.* it is accessable from anywhere in your page
        //you can either
        //declare a public variable like this
        youTubeMe.player = "youtube player";
        //or a public method like this
        youTubeMe.foo = function(){
            //this "this" here is your youTubeMe object
            console.log(this);
            bar();
        };
    
        //like the private variable at the top, this function is private
        //and can only be called from inside the youTubeMe object   
        function bar(){
            //this "this" here is the window
            console.log(this);
        }
    
    })();
    
    
    console.log(youTubeMe.player); //out puts youtube_player 
    youTubeMe.foo(); //outputs the youTubeMe object
    youTubeMe.bar() //throws an undefined error
    至于youtube api;我总是觉得它真的很好。我从未使用过iframe嵌入,只是因为“iframe嵌入”听起来不对。如果使用,则有两个选项:或。看看嵌入式播放器,因为除非你想为你的播放器构建一个定制的皮肤,否则这是一个不错的选择。当您使用api时,创建播放列表变得很容易,因为您可以让javascript完成所有播放和播放列表的工作

    希望有帮助

    var youTubeMe = {
        pageSize: 10,
        player: null,
        startIndex: 1,
        username: 'google',
    
        init: function() {
            $.getJSON('http://gdata.youtube.com/feeds/users/' + this.username + '/uploads?alt=json&start-index=' + this.startIndex + '&max-results=' + youTubeMe.pageSize, youTubeMe.createYouTubePlayers);
        },
    
        createYouTubePlayers: function(data) {
            $('#player').empty();
            $('#pager').empty();
            if (data.feed.entry.length < youTubeMe.pageSize) {
                youTubeMe.createPreviousButton();
            } else {
                if (youTubeMe.startIndex !== 1) {
                    youTubeMe.createPreviousButton();
                }
                youTubeMe.createNextButton();
            }
    
            for (var i = 0; i < data.feed.entry.length; i++) {
                player = new YT.Player('player', {
                    height: '195',
                    width: '320',
                    videoId: data.feed.entry[i].id.$t.split('/')[5]
                });
            }
        },
    
        createNextButton: function() {
            $('<a id=\"next\" href=\"#\">next</a>').appendTo('#pager');
            $('#next').click(function(e) {
                e.preventDefault();
                youTubeMe.startIndex += youTubeMe.pageSize;
                youTubeMe.init();
            });
        },
    
        createPreviousButton: function() {
            $('<a id=\"prev\" href=\"#\">prev</a>').appendTo('#pager');
    
            $('#prev').click(function(e) {
                e.preventDefault();
                youTubeMe.startIndex -= youTubeMe.pageSize;
                youTubeMe.init();
            });
        }
    
    };
    
    iframe { margin: 20px; }
    #pager { background-color: #666; line-height: 3em; text-align: center; }
    #pager a { color: #fff; font-size: 1.8em; margin: 0 15px; }
    
    //a closure function that calls itself
    (function(){
    
        //with var it would be private and not accesable like this: 
        //youTubeMe.pageSize
        var pageSize = 10;
    
        //declare a global reference to the youTubeMe object
        var youTubeMe = window.youTubeMe = function(){
    
        };
    
        //with youTubeMe.* it is accessable from anywhere in your page
        //you can either
        //declare a public variable like this
        youTubeMe.player = "youtube player";
        //or a public method like this
        youTubeMe.foo = function(){
            //this "this" here is your youTubeMe object
            console.log(this);
            bar();
        };
    
        //like the private variable at the top, this function is private
        //and can only be called from inside the youTubeMe object   
        function bar(){
            //this "this" here is the window
            console.log(this);
        }
    
    })();
    
    
    console.log(youTubeMe.player); //out puts youtube_player 
    youTubeMe.foo(); //outputs the youTubeMe object
    youTubeMe.bar() //throws an undefined error