Question

以下代码显示一个链接，该链接显示/隐藏下一个单元格的输出：

from IPython.display import HTML
HTML('''<script>
function code_toggle_next() {
    $('div.cell.code_cell.rendered.selected').next().find('div.output').toggle();
    }
$( document ).ready(code_toggle_next);
</script>
<a href="javascript:code_toggle_next()"> To show/hide next the output of the next cell, click here </a>.''')

但是，一旦将笔记本导出为HTML，它似乎就无法工作：显示下一个单元格的输出，并且单击链接不会执行任何操作。关于如何解决此问题的任何建议？

Answer 1

打开HTML文件并根据您的浏览器选择Inspect元素或DEV工具时，您会看到该单元格缺少类selected，因此第一个选择器将返回空结果。我尝试过删除该类，从而解决了该问题。

但是，它将返回所有单元格，因此，如果您使用.next().find('div.output')，则它将应用于除第一个单元格以外的所有单元格。使用onclick属性可能更好。这样，您可以将单击的单元格作为参数传递给函数（see the docs），并且仍然仅切换以下单元格。看看：

from IPython.display import HTML
HTML('''<script>
function toggle_next(event) {
    $(event.target).closest('div.code_cell').next().find('div.output').toggle();
}
</script>
<a onclick="toggle_next(event)"> To show/hide next the output of the next cell, click here </a>.''')

切换以隐藏HTML版本的单元格输出

1 个答案: