页面效果如图

可自动回复，自动语音播放，可回车发送文字

js部分

$(function() {

    resetui()

    $('#iptsend').on('click', function() {
        var text = $('#ipt').val().trim();
        if (text.length <= 0) {
            return $('#ipt').val('')
        }
        //用户输入内容后，将内容添加至聊天窗口
        $('.talk_list').append('<li class="right_word"><img src="img/person02.png" /> <span>' + text + '</span></li>')
        $('#ipt').val('')
        getMsg(text);

        //输入结束后滚动条下拉至最底部
        resetui()
    })

    function getMsg(text) {
        $.ajax({
            method: 'get',
            url: 'http://www.liulongbin.top:3006/api/robot',
            data: {
                spoken: text
            },
            success: function(res) {
                if (res.message === 'success') {
                    //接收聊天消息
                    var msg = res.data.info.text;
                    $('.talk_list').append('<li class="left_word"><img src="img/person01.png" /> <span>' + msg + '</span></li>')
                    resetui()
                        //调用getVoice函数
                    getVoice(msg);
                }
            }
        })
    }

    //文字转换为语音
    function getVoice(text) {
        $.ajax({
            method: 'get',
            url: 'http://www.liulongbin.top:3006/api/synthesize',
            data: {
                text: text
            },
            success: function(res) {
                if (res.status === 200) {
                    //播放语音
                    $('#voice').attr('src', res.voiceUrl)
                }
            }
        })
    }

    //按下回车键发送消息
    $('#ipt').on('keyup', function(e) {
        if (e.keyCode === 13) {
            $('#iptsend').click();
        }
    })


})