1

onyoutubeplayerready 関数を必要とする 2 つの異なるプラグインを使用しています。

http://code.google.com/p/jquery-tubular/
http://badsyntax.github.com/jquery-youtube-player/examples/player.html

どちらも onyoutubeplayerready 関数を宣言して初期化します。したがって、プラグインの 1 つが機能しなくなります。

head タグには次の 3 つがあります。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript" src="js/jquery.youtube.player.js"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.tubular.js"></script>

どちらのスクリプトも、終了 body タグの直前に定義されています。

<script type="text/javascript">
//<![CDATA[

(function($){
    var config =  {

        repeatPlaylist: 1,

        // Custom playlist
        playlist: {
            title: 'Random videos',
            videos: [
                { id: 'CJCTiC1po8E', title: 'VCore Intro'},
                { id: 'ydCF922o944', title: 'VCore Admin' }, 
                { id: 'yC-_eqPqaoY', title: 'VCore Admin System' },
                { id: '7qkE30S2Btk', title: 'VCore Site' }
            ]
        }

        /*
        // Youtube playlist
        playlist: {
            playlist: '71B8152559FA2805'
        }

        // Latest user videos
        playlist: {
            user: 'TheSensless'
        }
        */
    };

    $('.youtube-player').player(config)

})(this.jQuery);
//]]>
</script>
<script type="text/javascript">
(function($){
function initializeTub(){
    $('body').tubular('_VKW_M_uVjw','wrapper');

}
$('a').click(function(){initializeTub()}); //clicking a random link just to test it
})(jQuery)
</script>

@epascarello

私はあなたの解決策を試しました。最初に来るものにはこれがあります:

            window.onYouTubePlayerReady = function(id){ 
                console.log('2');


                var player = document.getElementById(id);

                player.addEventListener("onStateChange", 'onytplayerStateChange' + id);

                player.addEventListener('onError', 'onytplayerStateChange' + id);

                window['onytplayerStateChange' + id](9);
            };

2番目に来るものにはこれがあります:

var _onYouTubePlayerReady = onYouTubePlayerReady;
function onYouTubePlayerReady(playerId) {
console.log('1');
ytplayer = document.getElementById("myytplayer");
 ytplayer.setPlaybackQuality('medium');
 ytplayer.mute();

_onYouTubePlayerReady( playerId );

}

コンソールはこれを出力します:

2
2

したがって、最初に宣言されたものが両方とも呼び出されます。コンソールが 1 を出力しないため、2 番目の呼び出しは呼び出されません。

しかし、本 JavaScript Programmer's Reference によると:

In fact, if you attempt to overload a function, the most recent definition will be used. This is because of the mutable nature of objects such as functions.

その場合は次のようになります。

    <script type="text/javascript" src="js/jquery.youtube.player.js"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.tubular.js"></script>

チューブラーで定義された 1 つの関数が 2 番目に来るので、関数が最終的に呼び出されるときにそれが指されないのはなぜですか? 管状のスクリプトが 2 番目に来ることに注意してください。

また、フレッドのソリューションも機能しませんでした。

私はこれを試しましたが、どちらもうまくいきませんでした:

var _onYouTubePlayerReady = onYouTubePlayerReady;
function _onYouTubePlayerReady(playerId) {
console.log('1');
ytplayer = document.getElementById("myytplayer");
   ytplayer.setPlaybackQuality('medium');
   ytplayer.mute();

}
_onYouTubePlayerReady( playerId );

ちなみに、これがいつ呼び出されるかはわかりません。ある時点で魔法のように Google が呼び出されたようですが、プラグインに付属のスクリプトにはまったくありません。

返信ありがとうございます。

4

2 に答える 2

0

これを行う方法は、jQuery の.trigger()関数を使用してカスタム イベントを発生させることです (これを行う純粋な JS の方法はわかりません)。次に、コードを次のように変更できます
Youtube.player.js

window.onMyCustomEventOne = function(id){ 
  var player = document.getElementById(id);
  player.addEventListener("onStateChange", 'onytplayerStateChange' + id);
  player.addEventListener('onError', 'onytplayerStateChange' + id);

            window['onytplayerStateChange' + id](9);
        };
    }

Tubular:

function onMyCustomEventTwo(playerId) {
  ytplayer = document.getElementById("myytplayer");
  ytplayer.setPlaybackQuality('medium');
  ytplayer.mute();
}

そしてjQueryで:

window.onYouTubePlayerReady = function(vars){
  $('window').trigger('myCustomEventOne',vars).trigger('myCustomEventTwo',vars);
};

お役に立てれば!

于 2010-12-16T02:20:34.233 に答える
0

次のものを次のように変更できます

var _onYouTubePlayerReady = onYouTubePlayerReady;
function onYouTubePlayerReady(playerId) {
    //whatever code needs to be here
    _onYouTubePlayerReady( playerId );
}
于 2010-12-16T04:02:22.517 に答える