使用javascript更改R闪亮中selectinput的背景颜色答案

【问题标题】：Use javascript to change the backround color of selectinput in R shiny使用javascript更改R闪亮中selectinput的背景颜色
【发布时间】：2019-09-13 18:09:51
【问题描述】：

我有一个简单的闪亮应用程序，我想在其中使用 javascript 将我的 selectInput() 的背景颜色从白色更改为橙色。可能吗？我应该把callback 参数放在哪里？

#ui.r
library(shiny)
ui <- fluidPage(


  theme=shinytheme("slate") ,
  # App title ----
  titlePanel(uiOutput("title")),

  #This hides the temporary warning messages while the plots are being created
  tags$style(type="text/css",
             ".shiny-output-error { visibility: hidden; }",
             ".shiny-output-error:before { visibility: hidden; }"
  ),


  # Sidebar layout with input and output definitions ----
  sidebarLayout(

    uiOutput("menu"),



    # Main panel for displaying outputs ----
    mainPanel(

    )
  )
)
#server.r
server = function(input, output) {


  output$menu<-renderUI({

    sidebarPanel(width = 2,
                 selectInput("sel","",
                             choices = c("Home","About","Sector A","Sector B","Sector C"),
                             selected = "Home"),
                 tags$style(
                   "select#sel {background: #FFA500}"
                 )



    )
  })


}

【问题讨论】：

只是为了确定 - 您想根据所做的选择更改颜色吗？
不只是里面的白色

标签： javascript r shiny

【解决方案1】：

如果你输入selectize = FALSE，它应该可以工作。

默认情况下，selectInput 有 selectize = TRUE，它使用 selectize.js。

因此，如果您按原样运行代码，那么您应该会看到您的选择显示为 display: none

所以你的output$menu 会是这样的

  output$menu<-renderUI({

    sidebarPanel(width = 2,
                 selectInput("sel","",
                             choices = c("Home","About","Sector A","Sector B","Sector C"),
                             selected = "Home", selectize = FALSE),
                 tags$style(
                   "select#sel {background: #FFA500}"
                 )
    )
  })

【讨论】：

确实做到了

【解决方案2】：

根据您编辑的问题，您可能会在 selectInput 周围使用 div 容器

div(
 selectInput("sel","",
   choices = c("Home","About","Sector A","Sector B","Sector C"),
   selected = "Home"),
 style = "background: #FFA500"
)

或者，如果您想为整个侧边栏面板设置样式，请设置form.well

sidebarPanel(
  width = 2,
  selectInput(
    "sel","",
    choices = c("Home","About","Sector A","Sector B","Sector C"),
    selected = "Home"),
  tags$style(
    "form.well {background: #FFA500}"
  )
)

【讨论】：

我知道这一点，但它在我的代码中不起作用。查看编辑。