代码如下 <section id="player"> <video id="media" width="100%" height="100%" controls> <source id="v1" src="video/1.mp4"> </video> </section> <div class="container" width="100%" style="margin-top:20px"> <bu...展开
//js部分
window.onload=function(){
    document.getElementById("u1").onclick=function(){
        document.getElementById("v1").src="video/1.mp4";
        document.getElementById("media").load();
    }
    document.getElementById("u2").onclick=function(){
        document.getElementById("v1").src="video/2.mp4";
        document.getElementById("media").load();
    }
    document.getElementById("u3").onclick=function(){
        document.getElementById("v1").src="video/3.mp4";
        document.getElementById("media").load();
    }
    document.getElementById("u4").onclick=function(){
        document.getElementById("v1").src="video/4.mp4";
        document.getElementById("media").load();
    }
}

用js控制video的src_百度知道的更多相关文章

  1. JS控制Video播放器(快进、后退、播放、暂停、音量大小)

    思路: 一.首先监听触发事件. 比如:向上键对应的keyCode为38,向下键对应的keyCode为40,向左键对应的keyCode为37,向右键对应的keyCode为39,空格键对应的keyCode ...

  2. 用JS控制video暂停再播放

    模块就是用来进行封装,进行高内聚 低耦合的功能.其实各人认为ng2 的模块和.net的工程类似,如果要使用模块中定义的功能,第一步就是必须要引用它,ng2 中叫import 导入.那么我们看模块是否有 ...

  3. js插件---video.js如何使用

    js插件---video.js如何使用 一.总结 一句话总结:还是要去官方网站去看英文文档.快点把英语学好啊. 1.如何快速使用这些插件(比如video.js)? 直接百度这些js如何使用就可以了,这 ...

  4. Js控制iFrame切换加载网址

    <html> <head> <title>Js控制 iFrame 切换加载网址</title> </head> <body> & ...

  5. js控制TR的显示影藏

    在很多现实的场景中,有的文本框我们希望在选择“是”的按钮之后才出现,这就需要js控制TR的隐藏和显示,(div的影藏显示类似) 以下是一段选择是的按钮就显示身高和体重的文本框的代码.注意:ready方 ...

  6. js控制Bootstrap 模态框（Modal）插件

    js控制Bootstrap 模态框(Modal)插件 http://www.cnblogs.com/zzjeny/p/5564400.html

  7. js控制文本框只能输入中文、英文、数字与指定特殊符号.

    先在'' 里输入 onkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的 X换成你想输入的代码就可以了, 中文u4 ...

  8. JS控制flash的方法

    JS控制flash的一些方法:Play() ---------------------------------------- 播放动画 StopPlay()---------------------- ...

  9. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. VS2010-如何建立并运行多个含有main函数的文件

    一.先说两个概念,解决方案与工程 在VS2010中,工程都是在解决方案管理之下的.一个解决方案可以管理多个工程,可以把解决方案理解为多个有关系或者没有关系的工程的集合. 每个应用程序都作为一个工程来处 ...

  2. nginx源码分析——数组

    ngx_array.h /* * Copyright (C) Igor Sysoev * Copyright (C) Nginx, Inc. */ #ifndef _NGX_ARRAY_H_INCLU ...

  3. PAT甲级——A1096 Consecutive Factors【20】

    Among all the factors of a positive integer N, there may exist several consecutive numbers. For exam ...

  4. Django入门之基础篇01

    这是第一篇Django(花音:浆够)入门博客,学习Django的初衷是为了开发自己的个人小小网站(虽然有了博客园,还是想建立自己的博客,因为自主定制,香香香~!)

  5. java笔试之字符串反转

    写出一个程序,接受一个字符串,然后输出该字符串反转后的字符串. package test; import java.util.Scanner; public class exam04 { public ...

  6. kafka comsumer

    kafka的顺序消费只保证在同一个partition中而已

  7. Ionic JPush极光推送二

    1.看图解决问题   2.解决出现统计代码提示问题 修改这个java 文件 导入命名空间 import cn.jpush.android.api.JPushInterface; 添加方法 @Overr ...

  8. Shell 工具之 gawk

    gawk 程序是 Unix 中原 awk 程序的 GNU 版本.awk 程序在流编辑方面比 sed 编辑器更先进的是:它提供了一种编程语言而不仅仅是编辑器命令行. gawk 格式 gawk optio ...

  9. 转载 ASP.NET SignalR 与LayIM配合，轻松实现网站客服聊天室（一） 整理基础数据

    ASP.NET SignalR 与LayIM配合,轻松实现网站客服聊天室(一) 整理基础数据   最近碰巧发现一款比较好的Web即时通讯前端组件,layim,百度关键字即可,我下面要做的就是基于这个前 ...

  10. [转] Linux 句柄是什么 ？

    源地址:http://www.blogjava.net/shijian/archive/2012/04/06/373463.html 1.句柄就是一个标识符,只要获得对象的句柄,我们就可以对对象进行任 ...