我正在学习 py-script，您可以在其中使用 <py-script></py-script>在 HTML5 文件中编写 Python 代码。作为一个python coder，我想在仍然使用python的同时尝试web开发，所以如果我们可以使用py-script输出和输入信息会很有帮助。
例如，有人能解释一下如何让这个函数工作吗:
<html>
<head>
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>
<body>
<div>Type an sample input here</div>
<input id = “test_input”></input>
<-- How would you get this button to display the text you typed into the input into the div with the id, “test”--!>
<button id = “submit-button” onClick = “py-script-function”>
<div id = “test”></div>
<div
<py-script>
<py-script>
</body>
</html
我将不胜感激，我希望这也能帮助其他 py-script 用户。
最佳答案
我检查了 source code在 GitHub 上找到文件夹 examples .
使用文件 todo.html和 todo.py我创建了这个 index.html
(我使用本地服务器 python -m http.server 进行了测试)
我发现了一些元素，因为我对 JavaScript 和 CSS 有一些经验 - 所以学习 JavaScript 和 CSS 来处理 HTML 元素可能会很好。
index.html
<!DOCTYPE html>
<html>
<head>
<!--<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />-->
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>
<body>
<div>Type an sample input here</div>
<input type="text" id="test-input"/>
<button id="submit-button" type="submit" pys-onClick="my_function">OK</button>
<div id="test-output"></div>
<py-script>
from js import console
def my_function(*args, **kwargs):
#print('args:', args)
#print('kwargs:', kwargs)
console.log(f'args: {args}')
console.log(f'kwargs: {kwargs}')
text = Element('test-input').element.value
#print('text:', text)
console.log(f'text: {text}')
Element('test-output').element.innerText = text
</py-script>
</body>
</html>
这里是 Firefox 中 DevTool 中 JavaScript 控制台的屏幕截图。
加载所有模块需要更长的时间
(从 Create pyodine runtime 到 Collecting nodes...)
接下来您可以看到 console.log() 的输出。
您也可以使用 print() 但它会显示带有额外错误的文本 writing to undefined ....
关于python - 你如何使用 Pyscript 输入和输出文本？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/72093397/