java - 在Shiny中添加带有各种顶级导航栏的链接面板选项卡

我正在尝试使用Shiny应用程序中的navbar创建链接。我在A gist of programatically changing panel tabs in Shiny找到了以下代码。它适用于第一个导航面板，但不适用于第二个。这是我的ui.R：

require(shiny)


shinyUI(navbarPage("",
                   tabPanel("Foo",
                            tabsetPanel(
                              tabPanel("Foo1",
                                       sidebarLayout(
                                         sidebarPanel(
                                           tags$div(div(id="Foo2", tags$a("Foo2"))
                                           )
                                             ),
                                         mainPanel(p("hello Foo1"))
                              )),
                              tabPanel("Foo2",
                                       sidebarLayout(
                                         sidebarPanel(),
                                         mainPanel(p("hello Foo2"))),
                                         HTML("<script>$('#Foo2').click(function() {
                                                        tabs = $('.tabbable .nav.nav-tabs li')
                                                         tabs.each(function() {
                                                            $(this).removeClass('active')
                                                         })
                                                         $(tabs[1]).addClass('active')

                                                         tabsContents = $('.tabbable .tab-content .tab-pane')
                                                         tabsContents.each(function() {
                                                            $(this).removeClass('active')
                                                         })
                                                         $(tabsContents[1]).addClass('active')

                                                        $('#Foo2').trigger('change').trigger('shown');

                                                     })</script>")
                                       )
                              )
                                ),
                   tabPanel("Bar",
                            tabsetPanel(
                              tabPanel("Bar1",
                                       sidebarLayout(
                                         sidebarPanel(
                                           tags$div(div(id="Bar2", tags$a("Bar2"))
                                           )
                                         ),
                                         mainPanel(p("hello Bar1"))
                                       )),
                              tabPanel("Bar2",
                                       sidebarLayout(
                                         sidebarPanel(),
                                         mainPanel(p("hello Bar2"))),
                                       HTML("<script>$('#Bar2').click(function() {
                                                        tabs = $('.tabbable .nav.nav-tabs li')
                                                         tabs.each(function() {
                                                            $(this).removeClass('active')
                                                         })
                                                         $(tabs[1]).addClass('active')

                                                         tabsContents = $('.tabbable .tab-content .tab-pane')
                                                         tabsContents.each(function() {
                                                            $(this).removeClass('active')
                                                         })
                                                         $(tabsContents[1]).addClass('active')

                                                        $('#Bar2').trigger('change').trigger('shown');

                                                     })</script>")
                              )
                            )
                   )
                   )
)

当您在foo1的侧边栏面板中单击时，指向foo2的链接将响应。但是，当您在Bar中执行相同操作时，它将移至其他位置。

最佳答案

这是您的解决方案;）。

require(shiny)
shinyUI(navbarPage("",
            tabPanel("Foo",
               tabsetPanel(
                    tabPanel("Foo1",
                              sidebarLayout(
                                  sidebarPanel(tags$div(div(id="Foo2", tags$a("Foo2")))),
                                  mainPanel(p("hello Foo1")))
                     ),
                     tabPanel("Foo2",
                               sidebarLayout(
                                   sidebarPanel(),
                                   mainPanel(p("hello Foo2"))),
                                   HTML("<script>$('#Foo2').click(function() {
                                        tabs = $('.tabbable .nav.nav-tabs li')
                                        tabs.each(function() {
                                        $(this).removeClass('active')
                                        })
                                        $(tabs[1]).addClass('active')

                                        tabsContents = $('.tabbable .tab-content .tab-pane')
                                        tabsContents.each(function() {
                                        $(this).removeClass('active')
                                        })
                                        $(tabsContents[1]).addClass('active')

                                        $('#Foo2').trigger('change').trigger('shown');

                                        })</script>")
                                   )
                          )
                        ),
            tabPanel("Bar",
               tabsetPanel(
                     tabPanel("Bar1",
                               sidebarLayout(
                                   sidebarPanel(tags$div(div(id="Bar2",tags$a("Bar2")))),
                               mainPanel(p("hello Bar1"))
                                   )),
                     tabPanel("Bar2",
                               sidebarLayout(
                                   sidebarPanel(),
                                   mainPanel(p("hello Bar2"))),
                                   HTML("<script>$('#Bar2').click(function() {
                                        tabs = $('.tabbable .nav.nav-tabs li')
                                        tabs.each(function() {
                                        $(this).removeClass('active')
                                        })
                                        $(tabs[3]).addClass('active')

                                        tabsContents = $('.tabbable .tab-content .tab-pane')
                                        tabsContents.each(function() {
                                        $(this).removeClass('active')
                                        })
                                        $(tabsContents[3]).addClass('active')

                                        $('#Bar2').trigger('change').trigger('shown');

                                        })</script>")










                          )
                          )
                        )
                        )
                          )

关于java - 在Shiny中添加带有各种顶级导航栏的链接面板选项卡，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31236515/