如何将字符串文本动态附加到闪亮应用程序的主体？

Question

我正在尝试在 tags$h3 之后将反应性文本（来自 selectInput 的颜色名称）附加到闪亮应用程序的主体。我想这更像是一个 jquery 问题，但现在它一直在添加所选颜色而不是显示字符串 "reactively".

我想要的是替换 h3.colorLabel 中的字符串。

ui.R

library(shiny)
jsCode <- "shinyjs.pageCol = function(params){
$('body').css('background', params);
/*$('.colorName').after('<h3></h3>').addClass('colorLabel');
$('h3.colorLabel').replaceWith('<h3>'+params+'</h3>').addClass('colorLabel');
*/
$('h3.colorName').after('<h3>'+params+'</h3>').addClass('colorLabel');
};
"

shinyUI( fluidPage(
  useShinyjs(),
  extendShinyjs(text = jsCode),
  selectInput("col", "Colour:",
              c("white", "yellow", "red", "blue", "purple")),
  tags$h3('Just in case you are color-blind, the background color is:', class='colorName')
))

server.R

library(shiny)
library(shinyjs)

shinyServer(


    function(input,output,session) {

      observeEvent(input$col, {
         js$pageCol(input$col)
       })
      })

Answer 1

我想这就是你想要的。它编辑 h3' element with thecolorLabel` class 的 innerhtml。我还在 ui 代码中添加了一个相应的空初始化元素，以便进行编辑。

library(shiny)
library(shinyjs)

jsCode <- "shinyjs.pageCol = function(params){
$('body').css('background', params);
$('h3.colorLabel').text(params); 
};
"

u <- shinyUI(fluidPage(
  useShinyjs(),
  extendShinyjs(text = jsCode),
  selectInput("col","Colour:",
              c("white","yellow","red","blue","purple")),
  tags$h3('Just in case you are color-blind, the background color is:',class ='colorName'),
  tags$h3('',class = 'colorLabel')
))


s <- shinyServer(


  function(input,output,session) {

    observeEvent(input$col, {
      js$pageCol(input$col)
    })
  })
shinyApp(ui = u,server = s)

产量：

这是内部正在编辑的内容：

如何将字符串文本动态附加到闪亮应用程序的主体？

How to dynamically append a string text to the body of a shiny app?

javascript

jquery

r

shiny

shinyjs