通过在 Shiny 应用程序的服务器部分创建的 jQuery UI 元素进行访问

Question

我想在单击特定伪类的元素时传递给它的闪亮 ID。如果 UI 元素是在 Shiny 应用程序的 UI 部分创建的，则一切正常。但是，当 UI 在服务器端（由 ）创建时，renderUI它不起作用。下面是可重现的示例。

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  fluidRow(
    tags$div(id = "ui1", class = 'shiny-html-output shiny-bound-output',
      tags$a(id = "ID1", class = "my-class", href = "#", 'Link 1')
    ),
    uiOutput("ui2")
  )
)

server <- function(input, output) {
  output$ui2 <- renderUI({
    tags$a(id = "ID2", class = "my-class", href = "#", 'Link 2')
  })

  shinyjs::runjs(
  '$(document).ready(function(){
    $(".my-class").click(function(){
      alert($(this).attr("id"));
    });
  });')
}

shinyApp(ui, server)

Answer 1

$(document).ready该方法不起作用，因为服务器在 DOM 准备好之前不会渲染它的输出。相反session$onFlushed，将once参数设置为TRUE，那么闪亮将仅运行该函数一次，而不是在每次会话刷新时运行该函数。

这将起作用：

library(shiny)
library(shinyjs)

script <- "$('.my-class').click(function(){
alert($(this).attr('id'));
});"

ui <- fluidPage(
  useShinyjs(),
  fluidRow(
    tags$div(id = "ui1", class = 'shiny-html-output shiny-bound-output',
             tags$a(id = "ID1", class = "my-class", href = "#", 'Link 1')
    ),
    uiOutput("ui2")
  )
)

server <- function(input, output, session) {

  output$ui2 <- renderUI({
    tags$a(id = "ID2", class = "my-class", href = "#", 'Link 2')
  })


  session$onFlushed(function() {
    shinyjs::runjs(script)
  }, once=TRUE)

}

shinyApp(ui, server)