Safari尽管在点击事件中被调用，但仍阻止了视频上的play()

本文介绍了Safari尽管在点击事件中被调用，但仍阻止了视频上的play()的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在为html5元素创建一些自定义视频控件.我已将click事件处理程序绑定到播放/暂停按钮，该按钮在相应视频上调用.play().

I'm creating some custom video controls for an html5 element. I've bound a click event handler to a play/pause button which calls .play() on the corresponding video.

根据我的研究，除非您在点击处理程序中，否则Safari会阻止对.play()的调用，尽管我是从点击处理程序中触发它的，但它仍会阻止对.play()的调用，例如所以:

From my research, Safari will block calls to .play() unless you are in a click handler, however it is blocking my calls to .play() despite the fact that I am triggering it from within a click handler, like so:

$('.video-container .play-pause').click(function(event){ var $video = $(event.currentTarget).parent().find('video'); if($video[0].paused) $video[0].play(); else $video[0].pause(); });

错误:

Unhandled Promise Rejection: NotSupportedError (DOM Exception 9): The operation is not supported.

源自$video[0].play();的

.

Safari版本11.0.1(13604.3.5)

Safari Version 11.0.1 (13604.3.5)

OSX High Sierra 10.13.1(17B48)

OSX High Sierra 10.13.1 (17B48)

有什么想法吗?

推荐答案

E.解决方案是为视频源使用绝对路径，而不是相对路径.

Eugh. The solution was to use an absolute path for the video source, not a relative one.

这是错误的:<video src="assets/vid.mp4"></video>

这是正确的:<video src="example/assets/vid.mp4"></video>