在我的页面中,我有许多视频,当我在HTML5中播放另一个视频时,我想停止该视频。
<?php
$result = "SELECT data from events_gallery where `events_id`='$id'";
$query = mysqli_query($db, $result);
$rows = mysqli_num_rows($query);
if($rows > 0){
while ($res = mysqli_fetch_array($query)) {
$image = $res['data'];
}
?>
<div class="item active">
<video controls="controls" playsinline width="180" height="300">
<source src="images/video.mp4" type="video/mp4">
<p>Video is not Supporting</p>
</video>
</div>
<?php
}
?>发布于 2019-01-26 15:55:09
这就是方法
<div class="item active">
<video class="inlineVideo" controls="controls" playsinline width="180" height="300">
<source src="images/video.mp4" type="video/mp4" >
<p>Video is not Supporting</p>
</video>
</div>
<script type="text/javascript">
window.addEventListener('load', function(event){
document.querySelectorAll(".inlineVideo").forEach((el) => {
el.onplay = function(e){
// pause all the videos except the current.
document.querySelectorAll(".inlineVideo").forEach((el1) => {
if(el === el1)
el1.play();
else
el1.pause();
});
}
});
});
</script>发布于 2019-01-26 16:09:13
您应该依靠HTML5视频接口来控制您的视频。这是一个很好的起点:https://www.html5rocks.com/en/tutorials/video/basics
我在你的代码中看不到如何加载所有视频,但第一次尝试可能是在播放视频之前停止所有视频:
$(document).ready(function(){
// Add an eventlistener to all videos to detect when they start playing.
$("video").each(function(){
var video = $(this)[0];
video.addEventListener("playing", function() {
// Stop all other videos.
$("video").each(function(){
if($(this)[0] != video)
video.pause();
});
}, true);
);
}
});https://stackoverflow.com/questions/54376507
复制相似问题