后台没有写出来,只写了个ajax加载的demo~

可以方便的通过点击不同的li标签实现视频的切换。

等我学完java和serlet后再来填坑吧~

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>videoDemo</title>
    </head>
    <body>
        <ul id="list">
            <li οnclick="show(this)">视频1</li>
            <li οnclick="show(this)">视频2</li>
            <li οnclick="show(this)">视频3</li>
        </ul>
        <video width="800" height="" id="video_play1">

</video>
    </body>
    <script src="jquery.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        window.onload = function() {

var srcItem = ''; //初始化一个字符串存放后台返回的
            var url = "http://localhost:8088/service";//此处url为后台文件地址
            
            function show(obj){ //show方法
                  var $object = $(obj);
                var index = $object.index(); //取得当前点击的li的索引.
                  $.ajax({ //这里采用jquery的ajax,用来使用http协议里的get来取得后台返回的视频文件地址.
                        type: 'get', //get方法
                        url: url, //服务器地址
                        data: index, //传入数据,此处是get方法 可以传入index值给后台,以让后台返回文件地址的凭依
                        cache: false, //cache为缓存
                        dataType: 'json', //返回数据格式
                        success: function(result) {
                             srcItem = result.src; //将返回的src赋给srcItem
                             document.getElementById("video_play1").src = srcItem ; //给视频一个新地址
                             document.getElementById("video_play1").play(); //让视频可以播放
                             
                        }
                    },
                    error: function() {
                        console.log("ERROR");
                    }
                });
            }

}
    </script>
</html>

如何写一个video播放器的demo?相关推荐

  1. 写一个MP3播放器(vuejs+nodejs+mongodb)

    写一个MP3播放器(vue-cli+element ui+express+mongoose) 最近刚学完vuejs,为了增进理解就写了个MP3播放器(用到了vuex,vue-router,es6).可 ...

  2. 用vue简单写一个音乐播放器

    简单地写一个功能比较全的音乐播放器 前言 因为音乐播放器是一个很可能在项目遇到的东西,早写总比晚写好.趁没事先写个. 思路 一个音乐播放器该有的东西: 封面,歌名,专辑,作者 控制器(上一首,下一首, ...

  3. 写一个音乐播放器的微信小程序

    要创建一个音乐播放器的微信小程序,您需要熟悉微信小程序的开发环境和语言(如 JavaScript 和 WXML/WXSS). 具体来说,您需要做以下几件事: 设计音乐播放器的用户界面,并使用 WXML ...

  4. java写一个音乐播放器源码_求一个JAVA音乐播放器的源代码

    展开全部 import javax.media.ControllerEvent; import javax.media.ControllerListener; import javax.media.E ...

  5. FFmpe写一个多线程播放器1 基础逻辑和队列定义

    播放器线程模型 1:主线程输入文件 - 然后创建解复用线程 – 2 :解复用线程解码书pkt放入各自AV队列中 ---- 然后创建视频解码线程 3:音频解码在主线程中 由音频参数定义的回调函数决定 视 ...

  6. 用Kotlin写一个音乐播放器

    添加依赖 implementation "org.jetbrains.anko:anko:0.10.8" class home_frame : Fragment() {overri ...

  7. 300行代码写一个音乐播放器小程序

    刚进公司不久,因为公司部门年后业务拓展的关系,可能在年后会被分配到公司的微信公众号组做小程序相关的开发工作,因此写了个微信小程序wx-audio踩坑.目前还有一些功能没有写完:如返回多首歌曲.控制播放 ...

  8. 项目: 用C语言写一个音乐播放器

    目录 最终效果 代码 资源地址 最终效果 代码 /************ 音乐文件中 1开头的是周杰伦的歌 2开头的是林俊杰的歌 3开头的是许嵩的歌 *************/ #include& ...

  9. 采用FFMPEG开源库和vs2008 mfc 写一个H264播放器(1)

    /*    FFMPEG动态库使用  */ 1 将一下文件拷入工程当前目录下面 http://pan.baidu.com/disk/home#dir/path=%2FFFMPEG 2 设置项目属性 1 ...

最新文章

  1. Centos7上yum安装redis
  2. 浅析比特币的找零机制
  3. 根据输入的日期计算你活了多少天(新手)
  4. 秀尔算法:破解RSA加密的“不灭神话” --zz
  5. 《大数据》杂志——大数据容灾备份技术挑战和增量备份解决方案
  6. C++ Semaphore信号量使用
  7. (转) mp4编码全介绍 (一)
  8. java可选参数_Java可选
  9. .html() 与.text() 获取值、取值 区别
  10. C++ 虚函数表详解
  11. 【LeetCode】【字符串】题号:*151. 翻转字符串里的单词
  12. C/C++[codeup 2046]8皇后
  13. python终止线程_python怎样终止线程?
  14. 我的 6 年外包经验:印度、中国和菲律宾
  15. 赴日java常问问题_赴日软件工程师java笔试题
  16. SpringCloud 配置管理:Nacos
  17. MySQL燕十八老师课程笔记:第十六课:MySQL各个函数
  18. 【ZYNQ】中断机制介绍(一)
  19. myeclipse下server视图nullpoint问题
  20. FFmpeg av_dump_format输出的tbn、tbc、tbr、PAR、DAR的含义

热门文章

  1. 张驰咨询:六西格玛黑带培训能成为企业可持续应用的方法吗?
  2. 面试:Hook框架Xposed、Dexposed、Epic原理
  3. android获取手机型号和手机厂商
  4. 挣值管理计算公式学习
  5. 安装PyCrypto失败
  6. CSR8670--初步认识
  7. TWaver可视化编辑器(二)3D编辑器
  8. 利用GNS3搭建一个局域网使VM上的ubnutu访问Internet
  9. 安卓虚拟键盘_这是第一台安卓手机,当年谷歌和HTC靠它正面刚苹果|极客博物馆...
  10. 区块链技术创新应用势在必行 食品药品开启全链条溯源时代