function () {
    $('.audio').each(function () {
        var $this = $(this);
        var id = $this.attr('audioid');
        var src = $this.attr('src');
        var soundsize = $this.attr('soundsize');
        $this.append('<audio></audio>');
        $this.append('
<div class="btn-group audio-control">
    <button type="button" class="btn btn-default btn-repeat"><span class="glyphicon glyphicon-repeat"></span></button>
    <button type="button" class="btn btn-default btn-play"><span class="glyphicon glyphicon-play"></span></button>
    <button type="button" class="btn btn-default btn-pause"><span class="glyphicon glyphicon-pause"></span></button>
    <button class="btn btn-default" disabled="disabled">
        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">
                <span class="sr-only">60% Complete</span>
            </div>
        </div>
    </button>
    <button class="btn btn-default btn-size" disabled="disabled"></button>
</div>');

        var width = (soundsize < 20 ? 20 : soundsize > 60 ? 60 : soundsize) * 300 / 60;
        $this.find('.progress').width(width);
        var $btnplay = $this.find('.btn-play');
        var $btnpause = $this.find('.btn-pause').hide();
        var $btnrepeat = $this.find('.btn-repeat');
        var $btnsize = $this.find('.btn-size').text(soundsize + 's');
        var $audio = $this.find('audio');
        var $progressbar = $this.find('.progress-bar');

        $btnplay.bind('click', function () {
            if (!$audio.attr('src')) {
                $.ajax({
                    url: 'Sound.ashx',
                    data: { id: id, url: src },
                    dataType: 'json',
                    type: 'POST',
                    success: function (data, textStatus, jqXHR) {
                        // 加載音頻文件
                        if ($audio.attr('src') != data.url) {
                            $audio.bind({
                                'canplaythrough': function () {
                                    //alert('音頻文件已經準備好，隨時待命');
                                    this.volume = 1;
                                    this.play();
                                },
                                'timeupdate': function () {
                                    // 跟蹤進度
                                    var duration = this.duration;
                                    var currentTime = this.currentTime;
                                    $progressbar.width((currentTime / this.duration) * width);
                                },
                                'pause': function () {
                                    $btnplay.show();
                                    $btnpause.hide();
                                },
                                'ended': function () {
                                    $btnplay.show();
                                    $btnpause.hide();
                                },
                                'playing': function () {
                                    $btnplay.hide();
                                    $btnpause.show();
                                }
                            });
                            $audio.attr('src', data.url);
                        } 
                    }
                });
            }
            else {
                $audio[0].play();
            }
        });
        $btnpause.bind('click', function () {
            $audio[0].pause();
        });

        $btnrepeat.bind('click', function () {
            $audio[0].currentTime = 0;
            $audio[0].play(); ;
        });
    })

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            
            
            // 下載音頻文件
            var id = context.Request["id"];
            var url = context.Request["url"];

            // 判斷文件是否存在
            var filepath = "/Audio/" + id + ".mp3";
            if (System.IO.File.Exists(context.Server.MapPath(filepath)))
            {
                context.Response.Write("{"url":"" + filepath + ""}");
                return;
            }

            HttpPost clientContext = new HttpPost(url);
            var data = clientContext.GetBytes();
            SpeexAudio speex = new SpeexAudio();
            try
            {
                var filename = speex.Decoder(data
                   , context.Server.MapPath("~/Audio/ffmpeg.exe")
                   , context.Server.MapPath("~/temp/")
                   , context.Server.MapPath(filepath)
                   , SpeexDecoderType.MP3);
                context.Response.Write("{"url":"" + filepath + ""}");
                return;
                //context.Response.Redirect("~/Audio/" + filename);
            }
            catch (Exception)
            {

            }

            //context.Response.Write("Hello World");
        }

總結

以上是生活随笔為你收集整理的声音播放的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。