如何在 ipywidgets 的小部件回调函数中创建弹出窗口？答案

【问题标题】：How to create a popup in a widget call back function in ipywidgets?如何在 ipywidgets 的小部件回调函数中创建弹出窗口？
【发布时间】：2020-02-11 10:38:09
【问题描述】：

在jupyterlab环境（1.2.3版）中使用ipywidgets7.5.1和python3.6.9我已经创建了以下完整的测试代码：

from ipywidgets import widgets
from IPython.display import HTML,Javascript, display

def popup(text):
    display(HTML("<script>alert('{}');</script>".format(text)))

class Test:

    def __init__(self):        
        self.button = widgets.Button(description='TestButton')
        self.button.on_click(self.click) 
        display(self.button)

    def click(self,args):           
        popup("test2")   

popup("test1")          
login = Test()

运行此代码时，我得到一个带有文本 test1 的弹出窗口，这是我所期望的，但是当我单击按钮并执行回调函数时，我希望有另一个带有文本 test2 的弹出窗口，但没有任何反应.没有其他弹出窗口。

我该如何解决这个问题？

【问题讨论】：

当我点击按钮时，我可以看到第二个弹出很好。使用 python 3.6、ipywidgets 7.4.2 jupyter notebook 和 Chrome 80.0.3987.87。
使用 Google Colaboratory，我没有看到任何弹出窗口。

标签： javascript python-3.x jupyter ipywidgets

【解决方案1】：

在 Jupyter Lab 中，我看到了第一个弹出窗口，但在单击时，第二个没有弹出，只是在日志中添加了一个空行。

    $ jupyter --version                                                                    
    jupyter core     : 4.6.3                                                                                                                
    jupyter-notebook : 6.1.3                                                                                                
    qtconsole        : not installed                                                                                            
    ipython          : 7.17.0                                                                                               
    ipykernel        : 5.3.4                                                                                                
    jupyter client   : 6.1.6                                                                                                
    jupyter lab      : 2.2.8                                                                                                
    nbconvert        : 5.6.1                                                                                                
    ipywidgets       : 7.5.1                                                                                                
    nbformat         : 5.0.7                                                                                                
    traitlets        : 4.3.3

【讨论】：

请解释一下你的答案。

【解决方案2】：

将这些脚本放在小部件调用的函数中

from IPython.display import HTML,Javascript, display
display(Javascript("""
    require(
        ["base/js/dialog"], 
        function(dialog) {
            dialog.modal({
                title: 'Hello world',
                body: 'Hi, lorem ipsum and such',
                buttons: {
                    'kthxbye': {}}
            });
        }
    );

"""))

【讨论】：

这是什么require？你能展示一些完整的代码吗？