PyScript_tutorial/loop_in_pyscript.html at main · bithabib/PyScript_tutorial · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>

<head>
    <!-- <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" /> -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>

<body>
    <div class="container text-center p-5">
        <h1>Input and Output</h1>
        <input type="number" id="test-input"/>
        <button id="test-button" pys-onclick="my_function">Click me</button>
        <div id="test-output" class="p-3"></div>
        <py-script>
from js import console
def my_function(*args, **kwargs):
    test_number = Element("test-input").element.value
    for i in range(int(test_number)):
        console.log("hello ",i)
        </py-script>
    </div>
</body>

</html>