r - 在 rmarkdown/knitr 中的 block 之前和之后插入 html 代码

Question

我正在 rmarkdown 文档中创建一些 R 练习，但我不希望显示答案，除非用户单击按钮。

我设法使用以下代码做到了这一点:

---
title: "Aula 01 - Exercícios"
date : 2016-01-18
layout: post
comments: true
tags: exercicio
category: exercicio
---

<script>
  var toggle = function(i) {
  var mydiv = document.getElementById('q' + i);
  if (mydiv.style.display === 'block' || mydiv.style.display === '')
    mydiv.style.display = 'none';
  else
    mydiv.style.display = 'block'
  }
</script>



1) Calcule o número de ouro no R.

$$ \frac{1 + \sqrt{5}}{2} $$

<div id="q1"  style="display:none;" >
```{r}
(1 + sqrt(5))/2
```
</div>

<button type = "button" onclick="toggle(1);" class = "btn btn-success">+</button>

这很好用，但我想我重复了很多代码。当我有 100 个问题并决定更改按钮名称时，我会非常难过。

无论如何我可以做这样的事情:

---
title: "Aula 01 - Exercícios"
date : 2016-01-18
layout: post
comments: true
tags: exercicio
category: exercicio
---

<script>
  var toggle = function(i) {
  var mydiv = document.getElementById('q' + i);
  if (mydiv.style.display === 'block' || mydiv.style.display === '')
    mydiv.style.display = 'none';
  else
    mydiv.style.display = 'block'
  }
</script>



1) Calcule o número de ouro no R.

$$ \frac{1 + \sqrt{5}}{2} $$

```{r, option_to_include_code}
(1 + sqrt(5))/2
```

那么 knitr 在转换为 markdown 之前包含必要的 div 和 input 吗？

Answer 1

这是一种方法。这:

• 创建一个全局问题 # 计数器，并且
• 具有以下功能:
  
  
  • 将R表达式作为输入
  • 吐出一个<div>使用表达式、答案和按钮(格式由您决定)
  • 使用一些 R markdown 代码块选项使其全部正常工作

您不会以这种方式获得 R 代码格式，但如果您想这样做，这实际上是可行的。

RPubs example output

---
title: "Aula 01 - Exercícios"
date : 2016-01-18
layout: post
comments: true
tags: exercicio
category: exercicio
---
```{r echo=FALSE}
library(htmltools)

q_num <- 1
q_inc <- function(q_exp) {
  q_num <<- q_num + 1
  return(div(div(id=sprintf("q%d", q_num-1), 
                 style="display:none;", 
                 pre(deparse(substitute(q_exp)), q_exp)),
              HTML(sprintf('<button type="button" onclick="toggle(%d);" class="btn btn-success">+</button>', 
                           q_num-1))))
}
```
<script>
  var toggle = function(i) {
  var mydiv = document.getElementById('q' + i);
  if (mydiv.style.display === 'block' || mydiv.style.display === '')
    mydiv.style.display = 'none';
  else
    mydiv.style.display = 'block'
  }
</script>



1) Calcule o número de ouro no R.

$$ \frac{1 + \sqrt{5}}{2} $$

```{r, echo=FALSE, results="markup"}
q_inc((1 + sqrt(5))/2)
```

2) Calcule o número de ouro no R again.

$$ \frac{2 + \sqrt{5}}{2} $$

```{r, echo=FALSE, results="markup"}
q_inc((2 + sqrt(5))/2)
```