代码如下 <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. Ubuntu 12.04 Eclipse设置 Javadoc背景色

    在Ambiance主题下,eclipse弹出的tip是黑色背景的,这样压根就看不清java doc. 当然可以在外观改变系统主题为其他主题,相应的gtk-2.0/gtkrc要重新设置,比如Ubuntu ...

  2. PHP面向对象魔术方法基本了解

    简单介绍 (1) 魔术方法都是系统提供,程序员使用即可. (2) 所有的魔术方法,前面都是以  __ 开头的 _是两个下划线. (3) 我们在自定义函数时,就不要使用 __开头了. (4) 魔术方法是 ...

  3. php面向对象的初认识

    面向对象的基本概念 面向对象的三大特征:继承 封装 多态 类和对象: 类是一个抽象的概念 对象是一个具体的实例 张三是一个对象,李四也是一个对象.王五同样是一个对象..... 他们都隶属于“人”这个“ ...

  4. java基础之完数判断

    完数: 完全数(Perfect number),又称完美数或完备数,是一些特殊的自然数.它所有的真因子(即除了自身以外的约数)的和(即因子函数),恰好等于它本身.如果一个数恰好等于它的因子之和,则称该 ...

  5. elasticsearch 中文API facets(⑩)

    facets Elasticsearch提供完整的java API用来支持facets.在查询的过程中,将需要计数的facets添加到FacetBuilders中.然后将该FacetBuilders条 ...

  6. Redis开发及管理实战

    目录 Redis数据类型 字符串 String string类型操作 字典 Hash 列表 List 集合 Set 有序集合 SortedSet 生产消费模型 Redis事务管理 事务命令 示例 Re ...

  7. 原声js实现nodejs中qs模块中的parse和stringfiy方法

    function stringify(obj, sep, eq) { sep = sep || '&'; eq = eq || '='; let str = ""; for ...

  8. android服务的bindService/startService

    1,高版本android已经不允许只通过action来bindService/startService,可以通过: intent.setPackage("XXXX"); 来指定服务 ...

  9. JasperReports报表字段11

    报表字段是代表数据源和报表模板之间的数据映射元素.字段可以在报告中的表达式进行组合,以获得所需的输出.报表模板可以包含零个或更多的<field>元素.当声明报表字段,数据源应提供相应的数据 ...

  10. Servlet开发总结（一）

    一.Servlet简介 Servlet是sun公司提供的一门用于开发动态web资源的技术. Sun公司在其API中提供了一个servlet接口. 用户若想用发一个动态web资源(即开发一个Java程序 ...