使用 voila 和 Jupyter Hub 渲染 html 时将变量内容复制到剪贴板

Question

我正在使用 Jupyter HUB 从存储在服务器中的 jupyter 笔记本中渲染 Html 页面。

使用瞧时，我想创建一个按钮，将特定变量（文本）的内容复制到剪贴板中。

重现这种情况的最简单的示例如下。我尝试使用我在此处获得的代码通过 Ipython 注入 JS：（将 JavaScript 变量的输出复制到剪贴板）按钮应该触发代码并将文本放入剪贴板。但事实并非如此。

import ipywidgets as widgets

from IPython.display import display, HTML, Javascript

mybtn = widgets.Button(description='copy to clipboard',button_style='success')

        

def mybtn_event_handler(change):

    display(Javascript('''var cb = document.getElementById("cb");

  cb.value = 'asdfasdfasdfasdfasdfasdf';

  cb.style.display='block';

  cb.select();

  document.execCommand('copy');

  cb.style.display='none';''')) 

mybtn.on_click(mybtn_event_handler)

display(mybtn)

这在 jupyter hub 中不起作用。我想是因为实际上您没有在本地计算机中运行代码。

知道如何处理这种情况吗？

实际上，在其他情况下也会遇到这个问题，在这些情况下，使用 Ipython 在本地渲染笔记本时可以与本地浏览器进行交互，瞧。例如，使用 webbrowser 模块打开新选项卡很容易，但当笔记本在 jupyter HUB 中运行时它不起作用。

任何想法？

注意：代码不会产生错误，日志中只是显示： <IPython.core.display.Javascript object>

注意2：实际上在本地运行此代码不起作用，它会产生：添加输出的Javascript错误！类型错误：无法将属性&ldquo;值&rdquo;设置为 null 有关更多详细信息，请参阅您的浏览器 Javascript 控制台。

Answer 1

根据文档 - 您应该将 onclick 方法输出用widgets.Output(). 因此，为了通过单击按钮来运行一些 Javascript，您应该执行如下操作：import ipywidgets as widgetsfrom IPython.display import display, HTML, Javascriptmybtn = widgets.Button(description='copy to clipboard',button_style='success')output = widgets.Output()display(mybtn, output)&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;def mybtn_event_handler(b):&nbsp; &nbsp; with output:&nbsp; &nbsp; &nbsp; &nbsp; display(Javascript('''console.log("Success");'''))&nbsp;mybtn.on_click(mybtn_event_handler)