关于 javascript：如何在闪亮中以编程方式转到 HTML 锚点？

How to go to an HTML anchor programatically in shiny?

我可以使用 a("Go to Results", href = '#anchor_box') 在 ui 中添加指向锚点的链接，并让用户单击它以转到该锚点。

但是如何以编程方式将窗口"发送到"#anchor_box？例如，当运行时间较长的 observeEvent() 末尾有结果时？

您可以为此使用 javascript。有几种可能性，一种方法是获取元素并使用 scrollIntoView()，请参阅使用 javascript 进行锚点跳转。

在 shiny 中使用 javascript 的一种简单方法是 library(shinyjs).

您可以插入以下内容来告诉 R 移动焦点元素：

1
2
3

runjs('
document.getElementById("anchor_box").scrollIntoView();
')

为了知道何时执行此操作，您可以将其package在 observeEvent() 中：

1	observeEvent(eventExpr = input$clck, handlerExpr = {...})

缺点是刷新页面不会自动"向上滚动到顶部"。

可重现的例子：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

library(shiny)
library(shinyjs)

ui <- fluidPage(

a("Go to Results", href = '#anchor_box'),
actionButton("clck","Move Programmatically!"),

plotOutput("plot", height = 1300),
div(id ="anchor_box","HERE"),
useShinyjs(),

)

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

output$plot <- renderPlot({
plot(1)
})

observeEvent(eventExpr = input$clck, handlerExpr = {
runjs('
document.getElementById("anchor_box").scrollIntoView();
')
})

}

shinyApp(ui, server)