html5移动端调用语音功能

来源:互联网 发布:人工智能的智能含义 编辑:程序博客网 时间:2024/05/22 01:50


<form class="container js-ajax-form" role="form" method="post" id="msg_form" onsubmit="return false;">  <input type="hidden" name="doctor_id" value="1" />    <div class="fill-text">      <dl>          <dt>详细病情<span>(支持语音输入识别)</span></dt>          <dd>              <textarea name="msg" id="msg" placeholder="请输入详细病情,语音输入仅支持一次性输入,再次输入将覆盖之前内容。"></textarea>              <div class="tape">                  <span class="hear" id="hear" onclick="play()" ><input readonly type="hidden" name="localId"><b></b>'s<i></i></span>                  <span class="say" id="talk_btn"></span>              </div>          </dd>      </dl>    </div>    <div class="fill-button"><input type="submit" id="submit" value="发送留言"/></div></form><!-- 语音识别 start --><div class="sound-recording">    <dl>        <dt><i></i></dt>        <dd>            <span></span>            <span></span>            <span></span>            <span></span>            <span></span>            <span></span>        </dd>    </dl>    <p>2秒内找到合适医生</p></div>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

wx.ready(function(){});var START = null;   //开始时间var END = null; //最后时间var timeout = undefined;    //定时器  var state = 0;  //状态function showRecording() {    $(".sound-recording").show();//显示录音    //span的width随机变化    setInterval(function (){        $(".sound-recording dd span").each(function (){            $(this).width(48*Math.random() + 'px');        });    },200)    clearTimeout(timeout);    state = 0;      timeout = setTimeout(function() {          state = 1;      }, 1000);}function stopRecording() {    $(".sound-recording").hide();//关闭录音    clearTimeout(timeout);      state = 0;  }$("#talk_btn").on("touchstart", function (event) {      event.preventDefault();    START = new Date().getTime();    wx.startRecord({        success: function(){            recordTimer = setTimeout(function(){                var longTime = new Date().getTime();                if(longTime - START > 100){                    showRecording();                }                wx.startRecord({                    success: function(){                        localStorage.rainAllowRecord = 'true';                    }                });            },300);        },        cancel: function () {            stopRecording();            alert('用户拒绝授权录音');        }    });});//取消触摸$('#talk_btn').on('touchcancel', function(event){    stopRecording();    wx.stopRecord({        success: function (res) {            clearTimeout(recordTimer);        },        fail: function (res) {        }    });})      $("#talk_btn").on("touchend", function (event) {     stopRecording();    event.preventDefault();    END = new Date().getTime();    wx.stopRecord({        success: function (res) {            if((END - START) < 300){                END = 0;                START = 0;                //小于300ms,不录音                clearTimeout(recordTimer);                return;            }else{                $("#hear").css("display","inline-block");            }            // play(res.localId);            translateVoice(res.localId);            var timeLength = ((END-START)/1000).toFixed(1);  //时间差            $("#hear input").val(res.localId);            $("#hear b").text(timeLength);        },        fail: function (res) {                                                                                                    alert(JSON.stringify(res));        }    });}); //播放语音function play() {    var localId = $("#hear input").val();    $(".hear").addClass("cur");    wx.playVoice({        localId: localId    })    //语音播放结束的回调    wx.onVoicePlayEnd({        success: function (res) {            $(".hear").removeClass("cur");            //var localId = res.localId; // 返回音频的本地ID        }    });}function translateVoice(localId) {    wx.translateVoice({        localId: localId, // 需要识别的音频的本地Id,由录音相关接口获得        isShowProgressTips: 1, // 默认为1,显示进度提示        success: function (res) {            $('textarea[name=msg]').val(res.translateResult); // 语音识别的结果        }    });}function uploadVoice() {    var serverId = '';    var localId = $("#hear input").val();    if (localId != '') {        wx.uploadVoice({            localId: localId, // 需要上传的音频的本地ID,由stopRecord接口获得            isShowProgressTips: 1, // 默认为1,显示进度提示                success: function (res) {                serverId = res.serverId; // 返回音频的服务器端ID            }        });    }    return serverId;}$("#hear i").on("click", function (){    $("#hear input").val('');    $(this).parent().hide();})



0 0
原创粉丝点击