HTML5 Video Element на iPad не запускается по клику? - PullRequest
1 голос
/ 11 января 2011

Я использую элемент видео в моем HTML следующим образом:

<div id="container" style="background:black; overflow:hidden;width:320px;height:240px">
<video style="background:black;display:block" id="vdo" height="240px" width="320px" src="http://mydomain/vid.mp4"></video></div>
И в JavaScript я делаю это:
var video=document.getElementById('vdo');
var container=document.getElementById('container');
video.addEventListener('click', function(e) {
  e.preventDefault();
  console.log("clicked");
}, false);
container.addEventListener('click', function(e) {
  e.preventDefault();
  console.log("clicked");
}, false);
На настольном Safari / Chrome все работает нормально. Я вижу два "нажал" в консоли. Но на ipad ничего нет. Сначала я попробовал с iOS версии 3.2, затем безуспешно обновил ее до последней версии 4.2.1.
Я нашел похожий вопрос Элемент HTML5 Video на iPad не запускает события onclick или touchstart? там, где предлагается не использовать элементы управления в теге видео, а я его не использую.

Ответы [ 3 ]

4 голосов
/ 26 марта 2012

Это очень поздний ответ, но на случай, если кто-нибудь спросит. Если вы измените ваше событие на «touchstart», оно будет работать.

    video.addEventListener('touchstart', function(e) {

Такое поведение кажется мне случайным, потому что щелчок работает в большинстве случаев. Я не смотрел точно, почему и когда

0 голосов
/ 22 февраля 2011

Я попытался открепить / щелкнуть, как это предложил Фредерико, но я все еще не получал никаких событий щелчка.Я, однако, получаю touchstart и касаюсь событий ОК.(На самом деле, я получаю их от DIV на один уровень выше в DOM, но я ожидаю, что вы также можете получить их из элемента видео точно так же.)

0 голосов
/ 19 февраля 2011

Подтвердили ли вы, что в настоящее время нет других кликов, связанных с этим событием? Что я сделал, так это сначала отменил привязку к конкретному событию перед добавлением нового слушателя.

е:

video.unbind("click").click(function(){...}

Я нашел это, чтобы исправить возникшую проблему.

...