Eel应用中JS无法调用Python函数：切换按钮无终端输出

数据老陈

2026-7-3

解决Eel切换按钮点击后终端不打印"Test"的问题

问题根源

函数名称不匹配：JavaScript代码中调用的是eel.AfkOn()，但Python端暴露的函数是toggleAfk，Eel无法找到对应的Python函数，导致调用无效。
点击事件未绑定：HTML中的checkbox没有绑定触发AfkOn函数的事件，函数本身从未被执行。

修复方案

1. 统一Python与JS的函数名称

修改Python代码，将暴露的函数名改为AfkOn，与JS中的调用保持一致：

import eel

@eel.expose
def AfkOn():
    print('Test')

# 确保Eel初始化与启动代码正确
eel.init('web')  # 替换为你的前端文件所在目录
eel.start('index.html')

2. 给checkbox绑定点击/变更事件

有两种方式实现事件绑定：

方式一：直接在HTML标签中添加onclick属性

<div class="container-afk">
    <label class="toggle_box">
        <input type="checkbox" id="checkbox" onclick="AfkOn()">
        <div class="circle"></div>
        <h3 class="afk-text">AFK Reply</h3>
    </label>
</div>

方式二：在JavaScript中使用addEventListener（更推荐的模块化写法）

<script src="eel.js"></script>
<script src="script.js"></script>
<script>
    function AfkOn() {
        console.log('Checkbox clicked');
        var checkbox = document.getElementById('checkbox');
        if (checkbox.checked) {
            eel.AfkOn();
        }
    }
    // 页面加载完成后绑定事件
    document.addEventListener('DOMContentLoaded', function() {
        document.getElementById('checkbox').addEventListener('change', AfkOn);
    });
</script>