javascript 如何在Shiny中设置加载时的textInput焦点?

h43kikqp  于 2023-08-02  发布在  Java
关注(0)|答案(1)|浏览(67)

我无法调整Set focus in Shiny app to a specific UI element on load上的代码,以便在页面加载时将焦点设置在textInput上。最后一次尝试:

library(shiny)

js <- '
$(document).on("shiny:connected", function(){
  alert("Loaded");
  Shiny.setInputValue("loaded", 1);
  Shiny.addCustomMessageHandler("focus", function(x){
    $("#select ~ .input-control > .input").click();
  });
});
'

ui <- fluidPage(
  tags$head(tags$script(HTML(js))),
  headerPanel("Focus",  windowTitle = "Focus"),
  fluidRow(
    column(width = 2, class = "panel",
           textInput("spot", "spot"),
           actionButton("click", "Click")
    ),
    column(width = 10,
           textOutput("text")
    )
  )
)

server = function(input, output, session) {

  observeEvent(input$loaded, {
    session$sendCustomMessage("focus", list(NULL))
    print("Loaded")
  })

  observeEvent(input$select, {
    print("Selected")
  })

  observeEvent(input$click, {
    session$sendCustomMessage("focus", list(NULL))
    print("Clicked")
  })

  output$text <- renderText({

  })
}

shinyApp(ui = ui, server = server)

字符串

of1yzvn4

of1yzvn41#

您的textInputinputId“spot”,因此您必须在JS中替换它。此外,在textInput的情况下,使用select()就足够了。

js <- '
$(document).on("shiny:connected", function(){
  alert("Loaded");
  Shiny.setInputValue("loaded", 1);
  Shiny.addCustomMessageHandler("focus", function(x){
    $("#spot").select();
    Shiny.setInputValue("select", 1);
  });
});
'

字符串


的数据

相关问题