JavaScript 在 Shiny 的模态中不起作用
Posted
技术标签:
【中文标题】JavaScript 在 Shiny 的模态中不起作用【英文标题】:JavaScript not working within modal in Shiny 【发布时间】:2021-06-01 03:00:51 【问题描述】:我在 Shiny 应用程序中使用了一些 javascript 代码,以便在模式中设置 textAreaInput 的样式。我的代码如下所示:
library(shiny)
codeJS <- "
document.addEventListener('DOMContentLoaded', function(event)
function init (inputID)
var text = document.getElementById(inputID);
text.style.color = 'blue';
;
init('textField');
)"
ui <- fluidPage(
tags$script(html(codeJS)),
actionButton(inputId="openModal", label="Open modal")
)
server <- function(input, output, session)
observeEvent(input$openModal,
showModal(modalDialog(
textAreaInput(inputId = "textField", label = "window", value = "ABC")
))
)
shinyApp(ui, server)
当textAreaInput(inputId = "textField", label = "window", value = "ABC")
放在模态框之外时,JavaScript 代码可以正常工作。但是 JavaScript 代码对模态框内的输入没有影响。
有什么解决办法吗?
【问题讨论】:
【参考方案1】:YBS 让我走上了正轨。使用 JavaScript 而不是 CSS,代码变成这样:
codeJS <- "
function init (inputID)
var text = document.getElementById(inputID);
text.style.color = 'red';
text.style.fontSize = '20px';
text.style.fontStyle = 'italic';
;
init('textField');"
ui <- fluidPage(
actionButton(inputId="openModal", label="Open modal")
)
server <- function(input, output, session)
observeEvent(input$openModal,
showModal(modalDialog(
textAreaInput(inputId = "textField", label = "window", value = "ABC"),
tags$script(HTML(codeJS))
))
)
shinyApp(ui, server)
【讨论】:
你能告诉你运行脚本时出了什么问题吗? 您的回答很好。抱歉,我没有复制新的 codeJS 脚本,因为我认为您的原始 codeJS 没有更改。【参考方案2】:您可以包含如下所示的内联 CSS 代码。
ui <- fluidPage(
#tags$script(HTML(codeJS)),
actionButton(inputId="openModal", label="Open modal")
)
server <- function(input, output, session)
observeEvent(input$openModal,
showModal(modalDialog(
textAreaInput(inputId = "textField", label = "window", value = "ABC"),
tags$head(tags$style("#textFieldcolor: red;
font-size: 20px;
font-style: italic;
" ))
))
)
shinyApp(ui, server)
对于内联 javascript,试试这个
ui <- fluidPage(
actionButton(inputId="openModal", label="Open modal")
)
server <- function(input, output, session)
observeEvent(input$openModal,
showModal(modalDialog(
textAreaInput(inputId = "textField", label = "window", value = "ABC"),
tags$script(HTML('document.getElementById("textField").style.color = "red"'))
))
)
shinyApp(ui, server)
【讨论】:
你让我走上了正轨。但我想使用 JavaScript 而不是 CSS。以上是关于JavaScript 在 Shiny 的模态中不起作用的主要内容,如果未能解决你的问题,请参考以下文章
link_to 弹出模态 div 在 Rails 中不起作用
为啥 `R` 管道运算符 `|>` 在使用 Shiny 的反应式编程中不起作用?
eModal 在 bootstrap 3 中加载 javascript 但在 bootstrap 4 中不起作用