HTML5 Video Focus для устройств ввода

Question

У меня есть страница с несколькими видео HTML5.Я хочу использовать события клавиатуры и мыши для взаимодействия с каждым видео.Во Flash это не проблема, потому что после того, как вы щелкнете по видеообъекту, определенное видео получит фокус и получит все события от любых устройств ввода, если вы не нажмете на него.Я все еще новичок в видео HTML5, но я не уверен, как имитировать эту функцию focus в видео HTML5 с помощью javascript, поскольку focus не существует для тега видео, и вы не можете управлять однимвидео без него.

Большое спасибо заранее!

Answer 1

Я нашел способ подделать focus для элемента видео, используя глобальную переменную.например:

    $(function(){
        var focused_vid;
        $('video').click(function(){ focused_vid = this });
        $(document).keydown(function(e){ 
            if (focused_vid){
                var skip_step = focused_vid.duration*.01;

                switch(e.which){
                    case 37: // Back arrow
                        focused_vid.currentTime -= skip_step;
                        break;

                    case 39: // Forward arrow
                        focused_vid.currentTime += skip_step;
                        break;
                }
            }
        });
    });

Answer 2

На самом деле это происходит, если вы установите для таб-индекса числовое значение:

<video tab-index='-1' />

Answer 3

Вы пробовали:

<video id="foo">
</video>

<script>
  document.getElementById('foo').focus();
</script>

Метод фокусировки придает клавиатуре фокус элементу.