API jQuery и Vimeo Froogaloop

Question

Я создаю плагин для WordPress и пока хорошо работает с библиотекой PHP. Но у меня есть некоторые проблемы с JavaScript API.

Я пытаюсь использовать его с jQuery, и я думаю, что версия jQuery для WordPress не работает с ярлыком $f. Почему бы это не сработало?

var vimeoPlayer = {

    init: function() {
        var vimeoPlayers = document.querySelectorAll('iframe'),
        player;

        jQuery('iframe.vimeo-player').each(function(index, iframe){
            player = vimeoPlayers[index];
            $f(player).vimeoPlayer.addEvent('ready', vimeoPlayer.ready);
        });
    },

    addEvent: function(element, eventName, callback) {
        if (element.addEventListener) {
            element.addEventListener(eventName, callback, false);
        }
        else {
            element.attachEvent(eventName, callback, false);
        }
    },

    ready: function(player_id) {
        alert(player_id);
    }
}

jQuery(document).ready(function($){
    vimeoPlayer.init.call();
});

Вы можете увидеть это в действии на temp.woodshop.tv/?work/?dickies-campaign/?.

Я получаю эту ошибку:

TypeError: Результат выражения '$ f (player) .vimeoPlayer' [undefined] не является объектом.

Answer 1

Одной из проблем является то, что addEvent - это как определенная вами функция, так и метод объекта $ f (player). Похоже, вы путаете их. Метод addEvent объекта $ f (player) принимает только два аргумента: имя события player и вызываемую функцию. Его следует использовать как $ f (your-iframe) .addEvent ('событие vimeo', ваша_функция);

Ваша функция addEvent объединит события между методами IE и W3C. Это не нужно, потому что вы используете JQuery. jQuery (что угодно) .click () делает то же самое. Я не вижу ни одной части вашего фрагмента, где вам это нужно, но если вы это сделаете, я бы просто использовал метод jQuery.

Кроме того, объект проигрывателя видео должен иметь значение $ f (проигрыватель) вместо $ f (проигрыватель) .vimeoPlayer

Попробуйте это

jQuery('iframe.vimeo-player').each(function(){
    $f(this).addEvent('ready', ready);
});

Еще одна вещь, на которую следует обратить внимание, это то, что любые дополнительные события игрока должны быть добавлены из вашей функции обратного вызова. Например:

function ready(player_id){
    $f(player_id).addEvent('play', play);
    $f(player_id).api('play');
    alert("Ready!!!");
}
function play(){
    alert("Playing!!!");
}

Мне было трудно найти нужную информацию о API Vimeo Froogaloop, но после очистки Игровая площадка Vimeo Froogaloop API примерно дюжину раз я начинаю понимать, как она работает.

Удачи!

Answer 2

Вместо $f(player).vimeoPlayer.addEvent попробуйте $(this).addEvent.