时间戳

首页 > 解决方案 > 如何使用 HTML 中的 onBlur 从服务器调用烧瓶函数？

javascript - 如何使用 HTML 中的 onBlur 从服务器调用烧瓶函数？

问题描述

我是 Flask 的新手，我正在尝试制作一个简单的注册页面。这是代码-

{% extends 'layout.html' %}
{% block body %}

<div class="container">
        <form method="post" action="{{ url_for('signup') }}">

                <label for="user">Username </label>
                <input type="text" id="user" name="user" onblur='NameCheck()'>

               <i id='acceptIC' class="fas fa-check-circle"></i>


                <label for="pas">Password </label>
                <input type="password" id="pas" name="pas">


                <label for="mail">Email ID </label>
                <input type="email" id="mail" name="mail">

            <button type="submit">Signup</button>
        </form>
</div>

{% endblock %}

我希望在用户名失去焦点后立即在用户名旁边显示一个字体真棒图标，如果用户名可用（MongoDB 中的数据库），则此图标为绿色，如果不可用，则为红色。

标签： javascriptflaskflask-socketio

解决方案

这可以通过在 onBlur 调用中使用 flask-socketio 来实现，例如 -

function NameCheck(data) {
if (data !== '') {
    sock.emit('name_check', data);
    sock.on('responded', function (msg) {
        if (msg) {
            document.getElementById('acceptIC').style['display'] = 'flex';
           }
    });
}
}

在烧瓶 socketio 调用中

@socketio.on('name_check')
def handle_name(data):
    socketio.emit('responded', Mongo.checkUser(data))

在哪里

Mongo.checkUser(data)

是您所需的功能。返回一个布尔值

推荐阅读