默山 2021-07-03 16:34 采纳率: 0%
浏览 54
已采纳

socket.emit之后不想刷新页面

html中有id是btn的按钮,然后绑定了事件:

        document.querySelector("#btn").onclick = () => {
            const msg = document.querySelector('#msg').value;
            const post_time = new Date();
            socket.emit('client_send', {
                'name': '{{current_user.name}}',
                'avatar': '{{current_user.get_gravatar_url()}}',
                'msg': msg,
                'time': post_time.toLocaleDateString()
            });
            // alert("send")
        };

然后服务器收到消息,广播,接收服务器消息

@chat.route('/chatroom', methods=['POST', 'GET'])
def chatroom():
    return render_template('/chatroom.html')

@socketio.on("client_send", namespace='/msg')
def client_send(data):
    if data['msg'] != '':
        emit('server_response',
             {'name': data['name'],
              'avatar': data['avatar'],
              'msg': data['msg'],
              'time': data['time'],
              },
             broadcast=True
             )
    log.debug(data)

message_box是显示消息的div

        socket.on('server_response', function (res) {
            // alert(res.msg)
            var htmlData = '<div class="msg_item fn-clear">'
                + '   <div class="uface"><img src="' + res.avatar + '" width="40" height="40"  alt=""/></div>'
                + '   <div class="item_right">'
                + '     <div class="msg own">' + res.msg + '</div>'
                + '     <div class="name_time">' + res.name + ' · ' + res.time + '</div>'
                + '   </div>'
                + '</div>';
            $("#message_box").append(htmlData);
            $('#message_box').scrollTop($("#message_box")[0].scrollHeight + 20);
        });

但是每次emit之后页面都会自己刷新,一刷新,刚刚message_box里面append的内容就没了
怎么阻止它刷新呢?好像没查到什么相关资料

  • 写回答

1条回答 默认 最新

  • 默山 2021-07-04 14:53
    关注

    我懂了,不用回答了,谢谢!

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥50 关于#html5#的问题:H5页面用户手机返回的时候跳转到指定页面例如(语言-javascript)
  • ¥15 无法使用此凭据登录,因为你的域不可用,如何解决?(标签-Windows)
  • ¥15 yolov9的训练时间
  • ¥15 二叉树遍历没有报错但无法正常运行
  • ¥15 在linux系统下vscode运行robocup3d上场球员报错
  • ¥15 Python语言实验
  • ¥15 SAP HANA SQL 增加合计行
  • ¥20 用C#语言解决一个英文打字练习器,有偿
  • ¥15 srs-sip外部服务 webrtc支持H265格式
  • ¥15 在使用abaqus软件中,继承到assembly里的surfaces怎么使用python批量调动