国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

javascript - mui框架,錄音后怎么保存提交到手機本地呢?
PHPz
PHPz 2017-04-11 10:04:16
[JavaScript討論組]

錄音后怎么保存提交到手機本地呢?

<!DOCTYPE HTML>
<html>

    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta name="HandheldFriendly" content="true" />
        <meta name="MobileOptimized" content="320" />
        <title>Hello H5+ 2</title>
        <script type="text/javascript" src="../js/common.js"></script>
        <script type="text/javascript">
            var gentry = null,
                hl = null,
                le = null;
            var er = null,
                ep = null;
            // H5 plus事件處理
            function plusReady() {
                // 獲取音頻目錄對象
                plus.io.resolveLocalFileSystemURL("_doc/", function(entry) {
                    entry.getDirectory("audio", {
                        create: true
                    }, function(dir) {
                        gentry = dir;
                        updateHistory();
                    }, function(e) {
                        outSet("Get directory \"audio\" failed: " + e.message);
                    });
                }, function(e) {
                    outSet("Resolve \"_doc/\" failed: " + e.message);
                });
            }
            if(window.plus) {
                plusReady();
            } else {
                document.addEventListener("plusready", plusReady, false);
            }
            // DOMContentLoaded事件處理
            document.addEventListener("DOMContentLoaded", function() {
                // 獲取DOM元素對象
                hl = document.getElementById("history");
                le = document.getElementById("empty");
                er = document.getElementById("record");
                rt = document.getElementById("rtime");
                ep = document.getElementById("play");
                pt = document.getElementById("ptime");
                pp = document.getElementById("progress")
                ps = document.getElementById("schedule");
            }, false);
            // 添加播放項
            function createItem(entry) {
                var li = document.createElement("li");
                li.className = "ditem";
                li.innerHTML = '<span class="iplay"><font class="aname"></font><br/><font class="ainf"></font></span>';
                li.setAttribute("onclick", "playAudio(this);");
                hl.insertBefore(li, le.nextSibling);
                li.querySelector(".aname").innerText = entry.name;
                li.querySelector(".ainf").innerText = "...";
                li.entry = entry;
                updateInformation(li);
                // 設(shè)置空項不可見
                le.style.display = "none";
            }
            // 開始錄音
            var r = null,
                t = 0,
                ri = null,
                rt = null;

            function startRecord() {
                outSet("開始錄音:");
                r = plus.audio.getRecorder();
                setTimeout("stopRecord('120 seconds!')",121000);//錄制120秒
                if(r == null) {
                    outLine("錄音對象未獲取");
                    return;
                }
                r.record({
                    filename: "_doc/audio/"
                }, function(p) {
                    outLine("錄音完成:" + p);
                    plus.io.resolveLocalFileSystemURL(p, function(entry) {
                        createItem(entry);
                    }, function(e) {
                        outLine("讀取錄音文件錯誤:" + e.message);
                    });
                }, function(e) {
                    outLine("錄音失敗:" + e.message);
                });
                er.style.display = "block";
                t = 0;
                ri = setInterval(function() {
                    t++;
                    rt.innerText = timeToStr(t);
                }, 1000);
            }
            // 停止錄音
            function stopRecord() {
                er.style.display = "none";
                rt.innerText = "00:00:00";
                clearInterval(ri);
                ri = null;
                r.stop();
                w = null;
                r = null;
                t = 0;
                
            }
            // 清除歷史記錄
            function cleanHistory() {
                hl.innerHTML = '<li id="empty" class="ditem-empty">無歷史記錄</li>';
                le = document.getElementById("empty");
                // 刪除音頻文件
                outSet("清空錄音歷史記錄:");
                gentry.removeRecursively(function() {
                    // Success
                    outLine("操作成功!");
                }, function(e) {
                    ouline("操作失?。? + e.message);
                });
            }
            // 獲取錄音歷史列表
            function updateHistory() {
                if(!gentry) {
                    return;
                }
                var reader = gentry.createReader();
                reader.readEntries(function(entries) {
                    for(var i in entries) {
                        if(entries[i].isFile) {
                            createItem(entries[i]);
                        }
                    }
                }, function(e) {
                    outLine("讀取錄音列表失?。? + e.message);
                });
            }
            // 獲取錄音文件信息
            function updateInformation(li) {
                if(!li || !li.entry) {
                    return;
                }
                var entry = li.entry;
                entry.getMetadata(function(metadata) {
                    li.querySelector(".ainf").innerText = dateToStr(metadata.modificationTime);
                }, function(e) {
                    outLine("獲取文件\"" + entry.name + "\"信息失?。? + e.message);
                });
            }
            // 播放音頻文件
            function playAudio(li) {
                if(!li || !li.entry) {
                    ouSet("無效的音頻文件");
                    return;
                }
                outSet("播放音頻文件:" + li.entry.name);
                startPlay("_doc/audio/" + li.entry.name);
            }
            // 播放文件相關(guān)對象
            var p = null,
                pt = null,
                pp = null,
                ps = null,
                pi = null;
            // 開始播放
            function startPlay(url) {
                ep.style.display = "block";
                var L = pp.clientWidth;
                p = plus.audio.createPlayer(url);
                p.play(function() {
                    outLine("播放完成!");
                    // 播放完成
                    pt.innerText = timeToStr(d) + "/" + timeToStr(d);
                    ps.style.webkitTransition = "all 0.3s linear";
                    ps.style.width = L + "px";
                    stopPlay();
                }, function(e) {
                    outLine("播放音頻文件\"" + url + "\"失敗:" + e.message);
                });
                // 獲取總時長
                var d = p.getDuration();
                if(!d) {
                    pt.innerText = "00:00:00/" + timeToStr(d);
                }
                pi = setInterval(function() {
                    if(!d) { // 兼容無法及時獲取總時長的情況
                        d = p.getDuration();
                    }
                    var c = p.getPosition();
                    if(!c) { // 兼容無法及時獲取當(dāng)前播放位置的情況
                        return;
                    }
                    pt.innerText = timeToStr(c) + "/" + timeToStr(d);
                    var pct = Math.round(L * c / d);
                    if(pct < 8) {
                        pct = 8;
                    }
                    ps.style.width = pct + "px";
                }, 1000);
            }
            // 停止播放
            function stopPlay() {
                clearInterval(pi);
                pi = null;
                setTimeout(resetPlay, 500);
                // 操作播放對象
                if(p) {
                    p.stop();
                    p = null;
                }
            }
            // 重置播放頁面內(nèi)容
            function resetPlay() {
                ep.style.display = "none";
                ps.style.width = "8px";
                ps.style.webkitTransition = "all 1s linear";
                pt.innerText = "00:00:00/00:00:00";
            }
            // 重寫關(guān)閉
            var _back = window.back;

            function resetback() {
                // 停止播放
                if(ep.style.display == "block") {
                    stopPlay();
                } else if(er.style.display == "block") {
                    stopRecord();
                } else {
                    _back();
                }
            }
            window.back = resetback;
        </script>
        <link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8" />
        <style type="text/css">
            .rp {
                width: 100%;
                height: 100%;
                display: none;
                text-align: center;
                position: fixed;
                top: 0;
                background: rgba(0, 0, 0, 0.8);
                z-index: 9999;
                overflow: hidden;
            }
            
            .aname {
                font-size: 16px;
            }
            
            .ainf {
                font-size: 12px;
            }
            
            .rtime {
                font-size: 22px;
                color: #FF0000;
            }
            
            .ptime {
                margin-top: 40%;
                font-size: 22px;
                color: #FFFFFF;
            }
            
            .rprogress {
                background: url(../img/arecord.png) no-repeat center center;
                background-size: 32px 32px;
            }
            
            .rschedule {
                background-color: rgba(0, 0, 0, 0);
                border: 5px solid rgba(0, 183, 229, 0.9);
                opacity: .9;
                border-left: 5px solid rgba(0, 0, 0, 0);
                border-right: 5px solid rgba(0, 0, 0, 0);
                border-radius: 50px;
                box-shadow: 0 0 15px #2187e7;
                width: 36px;
                height: 36px;
                margin: 0 auto;
                -webkit-animation: spin 1s infinite linear;
                animation: spin 1s infinite linear;
            }
            
            @-webkit-keyframes spin {
                0% {
                    -webkit-transform: rotate(0deg);
                }
                100% {
                    -webkit-transform: rotate(360deg);
                }
            }
            
            @keyframes spin {
                0% {
                    transform: rotate(0deg);
                }
                100% {
                    transform: rotate(360deg);
                }
            }
            
            .progress {
                width: 90%;
                background-color: #666;
                margin: 0 5%;
                border: 1px solid #222;
                -webkit-border-radius: 5px;
                border-radius: 5px;
            }
            
            .schedule {
                width: 8px;
                height: 8px;
                margin: 1px 0;
                background-color: #FFCC33;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                -webkit-transition: all 1s linear;
                transition: all 1s linear;
            }
            
            .stop {
                width: 72px;
                height: 72px;
                background: url(../img/astop.png) center center;
                background-size: 72px 72px;
                margin: auto;
                -webkit-border-radius: 72px;
                border-radius: 72px;
            }
            
            .stop:active {
                -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5) inset;
                box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5) inset;
            }
            
            .iplay {
                display: block;
                background: no-repeat right center url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABYCAYAAAADWlKCAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAKwwAACsMBNCkkqwAAABZ0RVh0Q3JlYXRpb24gVGltZQAwOS8xMi8xM5w+I3MAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzVxteM2AAAD9UlEQVR4nO2b3XETMRRGDwzvoYOkg5hRAVkqiKmAdIA7wHSQVECoALsC1gXciV0BTge4gvCwgnHk9d/+WF8m97ztxrlXs8fS1Urym6enJxwd3uZugPMcFyKGCxHDhYjhQsRwIWK4EDFciBguRAwXIoYLEcOFiOFCxHAhYrgQMVyIGC5EDBcihgsRw4WI4ULEcCFiuBAx3uVuwDGY2XtgCBTAALjc8tEFMAdKYBJC+HOK9nXBm5dwUM7MCmAEXDcMMQVuQwhlV23qC2khZjYAboGrjkLOgFEIYd5RvM6RrSFmdgs80J0MYqyHGFsSuR4S60TJ9vrwCEziZ+YhhGXy/xdU9aWgqjfnW+IsgEKtvkgJiUPUPfUyZsD42DoQ68+Y+p62AG6UhjAZITt6xopq3L9vGf+Gqh6dJX+S6ilKNaRkU8YCGLSVARBjDGLMdS5jbgkkhMQiWyejSGtEG2KsghopKoU++5AV68ZDcrvXYWTH8Pghdz1R6CHpN3MFDPsc02PsYcy1qy0nJ6uQOANKZz+jfcOUmd3H6W1jYo5RcvsqtikbuXtI+kBmBxbwz8DczMZtksdcsz1tOinZhMRxPF2bGh8R4gz4amZLMxu2aEqa8zq2LQs5e0j6EB8bLv6dAz/NrGwyjMWcj3vadjJyCimS60nLeFfAbzO7bfANT3MXLdvSmJxCBsl12VHcL8AyvpkfSpo7bdvJyCkkfQfocv5/Bnw3s/mBs6Y097aFzd7JPcv6T5dv5GtcAr/2TZN7yt0IGSE908k0+RS8FiEvhhd1yKEFUw5YAVBApoe0XQrZwgL4GEIY7pLRU+5G5OwhC57PZgbAsqPYK6rdxUMXC9Npbro8fzJy9pB0qll0FPcOuDhCRl3ubEvwOYWUyXXb5YoZ1X7GqMHSfZq7bNmWxuQUki5XnDdc+n4EPoUQiiabSzFnejKl7TJOY7IJid/iaXJ7fESIFfCNas+9zQNMc05zHnjIPctKx/mrA9egflCJGLd5eDFXukGWdddQYU+95PlDWVE97GXPeS+oivf6saBZCKHoM+8+cvcQ2NyhOwMmfW4SxdgTNs9oZd0tBAEhsRDfJbcvgbIPKTtOnNzlPnECAkPWP8xsTv3ZrJ1v2UfmuKDqGRt5QgjZ9kDWyd5D1iioP1U4P3KzqZYYY5v0om38rpDpIeCHrUFMCPjPEeSE/COetf3SU/i7EEL2GVUdSjXkGfGBfWDzIFsb/q93dRizU2R7yDr+o09R/GfRzsmRrSGvFRcihgsRw4WI4ULEcCFiuBAxXIgYLkQMFyKGCxHDhYjhQsRwIWK4EDFciBguRAwXIoYLEcOFiOFCxHAhYrgQMf4CVuqCm+17t3sAAAAASUVORK5CYII=);
                background-size: 50px 44px;
                -ms-touch-action: auto;
            }
        </style>
    </head>

    <body>
        <header id="header">
            <p class="nvbt iback" onclick="back(true);"></p>
            <p class="nvtt">Audio</p>
            <p class="nvbt idoc" onclick="openDoc('Audio Document','/doc/audio.html')"></p>
        </header>
        <p id="dcontent" class="dcontent">
            <br/>
            <p class="button" onclick="startRecord()">開始錄音</p>
            <p class="button" onclick="startPlay('_www/audio/friendship.mp3')">播放音樂</p>
            <br/>
            <!-- History list -->
            <ul id="history" class="dlist" style="text-align:left;">
                <li id="empty" class="ditem-empty">無歷史記錄</li>
            </ul>
            <br/>
            <p class="button button-waring" onclick="cleanHistory();">清空歷史記錄</p>
            <br/>
        </p>
        <p id="output">
            Audio用于管理音頻設(shè)備,可調(diào)用麥克風(fēng)錄制音頻文件,也可播放音頻文件。
        </p>
        <p id="play" class="rp">
            <p id="ptime" class="ptime">00:00:00/00:00:00</p><br/>
            <p id="progress" class="progress">
                <p id="schedule" class="schedule"></p>
            </p>
            <br/>
            <p class="stop" onclick="stopPlay();outSet('停止播放!');"></p>
        </p>
        <p id="record" class="rp">
            <p style="width:100%;height:20%;"></p>
            <p class="rprogress">
                <p class="rschedule"></p>
            </p>
            <br/>
            <p id="rtime" class="rtime">00:00:00</p><br/>
            <p class="stop" onclick="stopRecord();"></p>
        </p>
    </body>
    <script type="text/javascript" src="../js/immersed.js"></script>

</html>
PHPz
PHPz

學(xué)習(xí)是最好的投資!

全部回復(fù)(1)
阿神

沒接觸過手機端,幫補了你

最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板
關(guān)于我們 免責(zé)申明 意見反饋 講師合作 廣告合作 最新更新
php中文網(wǎng):公益在線php培訓(xùn),幫助PHP學(xué)習(xí)者快速成長!
關(guān)注服務(wù)號 技術(shù)交流群
PHP中文網(wǎng)訂閱號
每天精選資源文章推送
PHP中文網(wǎng)APP
隨時隨地碎片化學(xué)習(xí)
PHP中文網(wǎng)抖音號
發(fā)現(xiàn)有趣的

Copyright 2014-2025 http://m.miracleart.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號