在线试听功能(前端直接略过吧,适合javaEE后台开发的)

  应用场景:录音试听,MP3试听...

比如为客户提供录音功能时。客户希望录音完成试听录音,然后下载等功能。
直接上代码:
关键是取得录音的在服务器的地址,如:url='http://localhost:8080/XXXX/XXXX/voice/imagine.wav'
下面是页面试听程序

    <button type="button" onclick="showvoice()" >试听</button>
    <script type="text/javascript" >
        function showvoice()
        {
            window.open(url);
        }
    </script>

 

基本就可以实现试听功能了。不过这样试听会调用Windows Media Player播放器,有时候系统没有播放器的话就无法播放了。
为了更广泛的客户群里。则需要修改功能。这个是调用微软网上的播发器播放

  <head> 
    <title>录音试听</title>
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" /> 
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
  </head>
  <body oncontextmenu="return false">
    <object title="dvubb" align="middle" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" class="object" id="MediaPlayer" width="480" height="360">
    <param name="AUTOSTART" value="true"/>
    <param name="ShowStatusBar" value="-1"/>
    <param name="Filename" value="${url}"/>
    <embed title="dvubb" type="application/x-oleobject" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" flename="mp" src="" width="480" height="360" autoplay="true"></embed>
    </object>
  </body>
window.open(url + params,'newwindow','height=400, width=500, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');

一般打开一个新页面试听。

当然现在流行的HTML5已经提供音频支持,非常方便。
audio标签
autoplay 如果出现该属性,则音频在就绪后马上播放。
controls 如果出现该属性,则向用户显示控件,比如播放按钮。
loop     如果出现该属性,则每当音频结束时重新开始播放。
preload  如果出现该属性,则音频在页面加载时进行加载,并预备播放。
         如果使用 "autoplay",则忽略该属性。
src      要播放的音频的 URL。
source标签
type     audio/ogg支持ogg文件  audio/mpeg  支持mp3,wav文件

<audio controls="controls">
  <source src="/i/song.ogg" type="audio/ogg">
</audio>

上面是我了解的三种方法。或许项目中用得到。抛砖引玉,切勿见笑。

 

2014-05-23 11:55:45

 

 

 

 

 

 

 

转载于:https://www.cnblogs.com/stay-9527/p/3747370.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值