如何正确使用Eel将下拉值从JavaScript传递到Python？

2024-07-03 05:37:49 发布

您现在位置：Python中文网/ 问答频道 /正文
983 3

我正在使用Python创建GUI

在这个UI中，我有一个下拉列表。用户将选择dropdown和submit的值，该值将反映在Python控制台中

但我无法从JavaScript中获得价值

这是我的Python代码：

from random import randint
import eel
  
eel.init("web")  
  
# Exposing the random_python function to javascript
@eel.expose    
def random_python():
    print("Random function running")
    return randint(1,100)


@eel.expose
def getList():
    lst = ["a","b","c","d"]
    return lst
  
eel.spawn(eel.js_myval()())
    

eel.start("index.html")

这是我的JavaScript：

let lst =document.getElementById("cate") 
document.getElementById("submit").addEventListener("click",()=>{
        eel.expose(js_myval)// here i am using eel expose
        function js_myval(){
            return lst.value;
    }
       
    
    })

这是我的html：

    <select name="meesho_category" id="cate">
        <option value="x">x</option>
        <option value="x">a</option>
        <option value="x">b</option>

    </select>

读这些

Pass JavaScript Variable Value to Python with Eel

https://github.com/ChrisKnott/Eel


Tags： toimportreturnvaluejsfunctionrandomjavascript
1条回答
网友
1楼 · 发布于 2024-07-03 05:37:49

我将回答您关于将下拉值从JavaScript传递到Python的狭义问题，并忽略与该问题无关的代码

首先，让我们像这样重写您的JavaScript，以便它关注您的问题：

document.getElementById("btn-submit").addEventListener("click",()=>{submit()}, false);

function submit() {
    eel.on_submit(document.getElementById("cate").value)
}

该JavaScript代码为btn-submit按钮定义了一个单击处理程序，它将读取cate下拉列表的值并将其发送给Python代码

接下来，让我们对Python文件进行同样的精简：

import eel
  
eel.init("web")

@eel.expose
def on_submit(cate_dropdown_val):
    print(f"cate val submitted: {cate_dropdown_val}")

eel.start("index.html")

这段代码将on_submit函数从Python公开到JavaScript。您会注意到它是在上面列出的submit函数内部的JavaScript块中调用的

最后，让我们看看HTML：

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="eel.js"></script>        
    </head>
    <body>
        <select name="meesho_category" id="cate">
            <option value="x">x</option>
            <option value="a">a</option>
            <option value="b">b</option>    
        </select>
        <button id="btn-submit">Submit</button>
    </body>
    <script type="text/javascript" src="js/app.js"></script>
</html>

此HTML定义了cate下拉元素、提交按钮，并导入上面显示的eel.js和自定义app.js

当应用程序运行时，用户单击submit按钮，Python控制台将向控制台打印cate下拉列表的值

从示例中的其他代码来看，您似乎想要构建更多的东西。请打开一个新问题，并提供您可能需要的其他帮助

相关问题 更多 >

    编程相关推荐