Introduction

Installation

Limitations of the "file" protocol

Frequently asked questions

Syntax, keywords and built-in functions

Standard distribution

import implementation

Brython packages

Browser interface

Introduction - DOM API
Creating a document
Accessing elements
Attributes, properties and methods

Events
Mouse events
Keyboard events
Focus events
Drag events

Query string

Interactions with Javascript

Brython-specific built-in modules

browser
browser.aio
browser.ajax
browser.html
browser.local_storage
browser.markdown
browser.object_storage
browser.session_storage
browser.svg
browser.template
browser.timer
browser.webcomponent
browser.websocket
browser.worker

Widgets
browser.widgets.dialog
browser.widgets.menu

interpreter
javascript

Working with Brython

Execution options
Testing and debugging
Deploying an application

Cookbook

Hello world !
Insert content in an element
HTML markup (bold,italic...)
HTML table
Bind and unbind events
Handle options in a SELECT
Drag and drop
Get the content of an element
Read the content of a file
Store objects locally
Example of onmouseover
 

Focus events

Focus events are

blur an element has lost focus
focusan element has received focus

Example

Click in the entry field below to make it receive focus, then click somewhere outside the field to make it lose focus.

   

Code

from browser import bind, document

@bind("#entry", "focus")
def focus(ev):
    document["traceFocus"].text = f"{ev.target.id} receives focus"

@bind("#entry", "blur")
def blur(ev):
    document["traceFocus"].text = f"{ev.target.id} loses focus"