带有javascript的HTML选项卡无法与rmarkdown中的shinny运行时一起工作

bt1cpqcv  于 2022-12-06  发布在  Java
关注(0)|答案(2)|浏览(100)

在正常的rmarkdown中,我对下面的html标签和java脚本没有问题。但是,在yaml中添加runtime: shiny后,我遇到了一个困难。内容无法显示。

---
title: "Untitled"
author: "John Doe"
date: "2022-11-28"
output: html_document
#runtime: shiny
---

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

My session info is:

R version 4.2.0 (2022-04-22 ucrt)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 10 x64 (build 19044)

Matrix products: default

locale:
[1] LC_COLLATE=English_Canada.utf8 LC_CTYPE=English_Canada.utf8
[3] LC_MONETARY=English_Canada.utf8 LC_NUMERIC=C
[5] LC_TIME=English_Canada.utf8

attached base packages:
[1] stats4 stats graphics grDevices utils datasets methods base

other attached packages:
[1] tibble_3.1.8 dplyr_1.0.10 ggplot2_3.4.0 Spectra_1.8.0
[5] ProtGenerics_1.29.1 BiocParallel_1.30.3 S4Vectors_0.34.0 BiocGenerics_0.42.0

loaded via a namespace (and not attached):
[1] Rcpp_1.0.9 assertthat_0.2.1 digest_0.6.30 utf8_1.2.2
[5] mime_0.12 R6_2.5.1 evaluate_0.18 pillar_1.8.1
[9] rlang_1.0.6 curl_4.3.3 rstudioapi_0.14 jquerylib_0.1.4
[13] rmarkdown_2.18 labeling_0.4.2 stringr_1.4.1 munsell_0.5.0
[17] shiny_1.7.3 compiler_4.2.0 httpuv_1.6.6 xfun_0.35
[21] pkgconfig_2.0.3 askpass_1.1 htmltools_0.5.3 openssl_2.0.4
[25] tidyselect_1.2.0 IRanges_2.30.0 codetools_0.2-18 fansi_1.0.3
[29] withr_2.5.0 later_1.3.0 MASS_7.3-56 grid_4.2.0
[33] jsonlite_1.8.3 xtable_1.8-4 gtable_0.3.1 lifecycle_1.0.3
[37] DBI_1.1.3 magrittr_2.0.3 MsCoreUtils_1.8.0 scales_1.2.1
[41] cli_3.4.1 stringi_1.7.8 cachem_1.0.6 farver_2.1.1
[45] fs_1.5.2 promises_1.2.0.1 bslib_0.4.1 ellipsis_0.3.2
[49] generics_0.1.3 vctrs_0.5.1 tools_4.2.0 glue_1.6.2
[53] rsconnect_0.8.28 parallel_4.2.0 fastmap_1.1.0 yaml_2.3.6
[57] clue_0.3-63 colorspace_2.0-3 cluster_2.1.3 memoise_2.0.1
[61] knitr_1.41 sass_0.4.3

vmjh9lq9

vmjh9lq91#

我不知道为什么,但是当使用runtime: shiny时,id="app_1"id="app_2"会变成id="section-app_1"id="section-app_2"。因此,您必须相应地更改对tablabel的调用:

<div class="tab">
<button class="tablinks active" onclick="tablabel(event, 'section-app_1')">Application 1</button>
<button class="tablinks" onclick="tablabel(event, 'section-app_2')">Application 2</button>
</div>
ct3nt3jp

ct3nt3jp2#

我尝试了一种不同的方法,并且成功了。谢谢@StéphaneLaurent

.nav-pills>li>a{
  background-color: #f1e4ff;
  color:black
}

.nav-pills>li>a:hover{
  background-color: #e4e5ff;
  color:black
} 

.nav-pills>li>a:focus, 
.nav-pills>li.active>a,     
.nav-pills>li.active>a:hover, 
.nav-pills>li.active>a:focus{
     background-color: #2b8cc4;
     color: #fff;
     }

相关问题