r - 如何在 R 中的 distill 文章中向 paged_table 和 kable 输出添加代码折叠

Question

感谢Martin Schmelzer，我们有一个很好的解决方案来隐藏/显示 R Markdown HTML 文档中代码块的输出。它也适用于从distillR 中的包中提取的文章。我希望它是否可以扩展到隐藏/显示 paged_table（来自Rmarkdown包）和 kable（来自knitr包）输出。我知道必须在 javascript 中添加一些内容以包含与 paged_table 和 kable 输出相关的类，但我不知道编写 javascript 代码。有可能一开始就这样做吗？谢谢。

---
title: "Untitled"
description: |
  A new article created using the Distill format.
author:
  - name: Nora Jones 
    url: https://example.com/norajones
    affiliation: Spacely Sprockets
    affiliation_url: https://example.com/spacelysprokets
date: "`r Sys.Date()`"
output: distill::distill_article
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

#paged_table output which I want to hide/show like code folding
```{r}
rmarkdown::paged_table(iris)
```

#kable output which I want to hide/show like code folding
```{r}
knitr::kable(iris)
```

受到@TarJae答案的启发，我正在更新这个问题，以更清楚地说明我想要什么。我直接复制了代码以从此处启用 div 类元素的隐藏/显示按钮。下面给出的是按钮的 javascript 代码。

function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}  

将此js脚本文件保存为“output_folding.js”，并在distill文章中通过以下代码调用。

<script src="output_folding.js"></script>

在具有 paged_table 输出或 kable 输出的代码块中启用隐藏/显示按钮。以下代码显示为 paged_table 输出。

<button onclick="myFunction()">Click Me</button>

<div id="myDIV">
```{r}
rmarkdown::paged_table(iris)
```
</div>   

这是最终的结果。

在点击按钮之前

点击按钮后

现在这可行，但我希望我能对此进行改进。下面显示的是此解决方案中发布的代码中的隐藏/显示按钮。

在点击按钮之前

点击按钮后

这与正常的代码输出完美结合，但不适用于 paged_table 和 kabel 输出。我想要的一些功能是代码；

1. 默认情况下，paged_table 或 kable 输出应该是隐藏的。
2. 单击按钮后，文本应从“隐藏输出”变为“显示输出”
3. 一个 CSS 文件，用于修改代码按钮的颜色和字体以及其中的文本。
4. 能够将按钮放置在右侧，以免妨碍视线。

简而言之，对于 distil 文章中的 paged_table 和 kable 输出，我希望拥有与此处提到的相同的按钮功能。非常感谢您阅读本文。

Answer 1

你的意思是这样的吗？

title: "Untitled"
description: |
  A new article created using the Distill format.
author:
   - name: Nora Jones 
    url: https://example.com/norajones
    affiliation: Spacely Sprockets
    affiliation_url: https://example.com/spacelysprokets
date: "`r Sys.Date()`"
output: distill::distill_article
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

#paged_table output which I want to hide/show like code folding
```{r}
rmarkdown::paged_table(iris)
```

#kable output which I want to hide/show like code folding
<button class="btn btn-primary" data-toggle="collapse" data-target="#BlockName">     Show/Hide </button>  
<div id="BlockName" class="collapse">  
```{r}
knitr::kable(iris)
```
</div>