Question

所以我有以下困境：

我正在使用Brython，一切正常。我有一小段代码为我执行ajax请求，我在标题中添加了它来绑定页面中当前元素的所有内容。

    from browser import document, ajax

# URL Query String
qs = ''
# URL to work on
url = ''


def post_data(url, qs):
    req = ajax.ajax()
    # Bind the complete State to the on_post_complete function
    req.bind('complete', on_post_complete)
    # send a POST request to the url
    req.open('POST', url, True)
    req.set_header('content-type', 'application/x-www-form-urlencoded')
    # send data as a dictionary
    req.send(qs)


def get_data(url, qs):
    req = ajax.ajax()
    req.bind('complete', on_get_complete)
    # Bind the complete State to the on_get_complete function
    req.open('GET', url+'?'+qs, True)
    req.set_header('content-type', 'application/x-www-form-urlencoded')
    req.send()


def on_post_complete(req):
    if req.status == 200 or req.status == 0:
        #  Take our response and inject it into the html div with id='main'
        document["main_area"].html = req.text
    else:
        document["main_area"].html = "error " + req.text


def on_get_complete(req):
    if req.status == 200 or req.status == 0:
        #  Take our response and inject it into the html div with id='main'
        document["main_area"].html = req.text
    else:
        document["main_area"].html = "error " + req.text


def account_click(ev):
    get_data("/account", qs)


def contact_link_click(ev):
    get_data("/contact", qs)


def logo_link_click(ev):
    get_data("/main_page", qs)


def products_link_click(ev):
    get_data("/products_page", qs)


def register_link_click(ev):
    get_data("/register", qs)

document['login_link'].bind('click', account_click)
document['contact_link'].bind('click', contact_link_click)
document['logo_link'].bind('click', logo_link_click)
document['register_link'].bind('click', register_link_click)

document['running_link'].bind('click', products_link_click)
document['fitness_link'].bind('click', products_link_click)
document['tennis_link'].bind('click', products_link_click)
document['football_link'].bind('click', products_link_click)
document['golf_link'].bind('click', products_link_click)

好了，现在我的更大问题是register_link从一开始就不在页面中。更确切地说，register_link只会在点击login_link链接后加载到DOM中，之后注册链接不会执行任何操作，因为事件无法从get get绑定到它上面。

现在我知道我可以通过在该页面中再次导入这个来轻松绕过这个但我想避免多余的导入，我不确定如何去做这个。

编辑：或者在brython中有一种方法可以等待DOM完全加载吗？

Answer 1

正如您所注意到的那样，写下account_click就像这样：

def account_click(ev):
    get_data("/account", qs)
    document['register_link'].active = True
    document['register_link'].bind('click', register_link_click)

不起作用，因为程序在执行下两行之前不会等get_data完成。

解决方案是针对这种情况编写特定版本的get_data和on_get_complete（我认为＆＃34; register_link＆＃34;按钮位于页面中，但最初被禁用）：

def complete_register(req):
    """Called when the Ajax request after "login_link" is complete."""
    if req.status == 200 or req.status == 0:
        #  Take our response and inject it into the html div with id='main'
        document["main_area"].html = req.text
        # enable "register link" button and add binding
        document['register_link'].disabled = False
        document['register_link'].bind('click', register_link_click)
    else:
        document["main_area"].html = "error " + req.text

def get_data_and_register(url, qs):
    req = ajax.ajax()
    req.bind('complete', complete_register)
    req.open('GET', url+'?'+qs, True)
    req.set_header('content-type', 'application/x-www-form-urlencoded')
    req.send()

def account_click(ev):
    get_data_and_register("/account", qs)

另一种选择是保留通用函数get_data和on_get_complete，并添加可选参数回调：

def get_data(url, qs, callback=None):
    req = ajax.ajax()
    req.bind('complete', lambda req:on_get_complete(req, callback))
    # Bind the complete State to the on_get_complete function
    req.open('GET', url+'?'+qs, True)
    req.set_header('content-type', 'application/x-www-form-urlencoded')
    req.send()

def on_get_complete(req, callback=None):
    if req.status == 200 or req.status == 0:
        #  Take our response and inject it into the html div with id='main'
        document["main_area"].html = req.text
        if callback is not None:
            callback(req)
    else:
        document["main_area"].html = "error " + req.text

Answer 2

这对你来说没有什么常识可言 - 而且这方面的Brython和Javascript一样：在你尝试修改/绑定之前，你想要改变的任何DOM元素都需要存在。

几十年来，＆＃34;通常＆＃34;在Javascript中执行此操作的方法是将绑定放在函数中，只需在页面底部调用它，或者在加载其他所有内容后在body标记onload事件上调用它。＆＃34;现代＆＃34; Javascript代码＆＃34;解决＆＃34;这可以通过使用jQuery或其他框架及其ready()方法。

你必须在那里做同样的事情 - 计时器可能会起作用，但它有风险。当然，在触发一个或多个其他功能之后存在的元素应该在各自的功能中处理：

def account_click(ev):
    get_data("/account", qs)
    document['register_link'].bind('click', register_link_click)

Brython将click事件绑定到页面中尚未存在的id

2 个答案: