html 通过点击按钮在同一页面相同位置切换视频

怎么在html 通过点击按钮在同一页面相同位置切换视频？弄了一天了，希望有懂的朋友解答一下。

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除结题
收藏举报

1条回答默认最新

coder2038 2023-05-28 15:25

关注

怎么在html 通过点击按钮在同一页面相同位置切换视频？弄了一天了，希望有懂的朋友解答一下。


```javascript

<!DOCTYPE html>
<html>
<head>
    <title>切换视频示例</title>
</head>
<body>
    <h1>切换视频示例</h1>

    <!-- 第一个视频 -->
    <video id="video1" width="640" height="360" controls>
        <source src="video1.mp4" type="video/mp4">
        Your browser does not support the video tag.
    </video>

    <!-- 第二个视频 -->
    <video id="video2" width="640" height="360" style="display:none" controls>
        <source src="video2.mp4" type="video/mp4">
        Your browser does not support the video tag.
    </video>

    <!-- 切换视频的按钮 -->
    <button onclick="toggleVideo()">切换视频</button>

    <script type="text/javascript">
        var video1 = document.getElementById("video1");
        var video2 = document.getElementById("video2");

        function toggleVideo() {
            if (video1.style.display === "none") {
                video1.style.display = "block";
                video2.style.display = "none";
            } else {
                video1.style.display = "none";
                video2.style.display = "block";
            }
        }
    </script>
</body>
</html>

```

报告相同问题？

关注问题

新人求问，HTML中怎么让两个按钮在同一行 css css3 html5
2019-06-26 10:14

回答 6 已采纳没看到你的html代码，一行的话丢一个行级标签里不就行了嘛，或者定位，浮动
怎么在当前页面点击不同的按钮切换为不同的页面? ajax html5 javascript
2022-03-25 17:13

回答 2 已采纳思路相当于点击的时候变下边的数据点击查询热表地址隐藏下面的数据把你想要的数据显示出来可以用 display='none';-display='bolck‘;控制元素显示隐藏 functi
如何使输入框和按钮在同一行前端
2022-12-19 10:24

回答 2 已采纳你这俩放到一个 div 里。如果还不行就给div 加个 display:flex属性
实现点击不同的按钮显示不同的内容【同一页面】web
2022-03-13 13:49

一键难忘的博客现需要在页面上面增加一个按钮：全部，已评分，为评分。每点一个不同的按钮怎么就要显示不同的内容。二，猜想使用一个js来控制不同的显示内容。每一个div设置一个不同的id。当点击show1()显示div《id=1》的内容...
HTML如何简单实现切换页面? html 前端
2022-01-02 08:38

回答 3 已采纳参考下Bootstrap Navs and tabs · Bootstrap v5 中文文档 v5.1 | Bootstrap 中文网 D
如何通过前端按钮调用后端的方法 html 前端后端
2022-06-23 16:16

回答 2 已采纳 ajax请求后端url
防止用户频繁点击切换页面的按钮 ajax html5 javascript jquery typescript
2020-01-09 18:56

回答 4 已采纳点击时用localStorage记录点击的时间。下次点击时判断当前时间与localStorage记录的时间相差是否大于1秒。
基于html的图片手动切换和自动切换
2022-03-06 14:43

在这里，我们可以为每张图片创建一个`<a>`标签，通过JavaScript监听点击事件，当用户点击“上一张”或“下一张”按钮时，改变图片的源URL（`src`属性），从而达到切换图片的效果。例如： ```html 上一张下一张 ...
关于vue前端点击一个按钮实现多个页面跳转的功能 javascript vue.js
2021-10-21 11:25

回答 2 已采纳 var buttonLinks=['www.baidu.com','www.csdn.net']; function onClick(event){ for(var i=0;i<butto
你好，html的一个按钮无法点击，点击无反应，这是为什么呢 html javascript 前端
2022-08-01 21:53

回答 3 已采纳亲建议你这样试试哦+关注function myFunction() { console.log("click me!"); });
点击按钮弹出弹窗，并且背景变暗不可点击 html javascript 前端
2022-05-11 23:47

回答 3 已采纳简单实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <
html如何点按钮后开始自动播放,跳转到html5视频中的当前时间后自动播放
2021-06-10 14:32

骏绿君的博客我正在尝试创建一个视频，在点击按钮后跳转到视频中的某个点后自动播放。我有它，以便视频跳到现场，但我无法弄清楚如何让它从那里自动播放。我是javascript的新手，我认为可能有一个我想念的简单解决方案。function...
怎么在chrome页面实现键盘自动点击按钮 java javascript
2022-05-08 11:27

回答 3 已采纳试下这个，点击按键'up'，触发 window.addEventListener('keyup', doSomething, true) function doSomething(e) { c
html切换导航不同页面,HTML按钮：导航到其他页面 - 不同的方法
2021-06-13 10:34

檬chung的博客有多种方式可以创建HTML按钮以导航到其他页面。HTML按钮：导航到其他页面 - 不同的方法方法1Click Me$('#btn_click').on('click', function() { window.location = 'http://www.google.com'; });优势：独立JS从HTML...
jQuery实现的点击按钮改变样式功能示例
2020-10-18 08:34

本示例中展示了如何使用jQuery来实现点击按钮改变页面元素的样式。具体来说，涉及到的技术点包括HTML页面结构的编写、CSS样式的应用以及jQuery脚本对事件的处理。首先，HTML部分定义了页面的基本结构。这里使用了...
没有解决我的问题, 去提问

问题事件

关注

码龄粉丝数原力等级 --

被采纳

被点赞

采纳率
创建了问题 5月28日

悬赏问题

¥15 这个如何解决详细步骤
¥15 在微信h5支付申请中，别人给钱就能用我的软件，这个的所属行业是啥？
¥30 靶向捕获探针设计软件包
¥15 react-diff-viewer组件，如何解决数据量过大卡顿问题
¥20 遥感植被物候指数空间分布图制作
¥15 安装了xlrd库但是import不了…
¥20 Github上传代码没有contribution和activity记录
¥20 SNETCracker
¥15 数学建模大赛交通流量控制
¥15 为什么我安装了open3d但是在调用的时候没有报错但是什么都没有发生呢

html 通过点击按钮在同一页面相同位置切换视频

1条回答 默认 最新

问题事件

悬赏问题

1条回答默认最新