Question

这个导航栏就是我想要的：

但是，点击Test，不应该打开一个面板，但只需运行一些JS代码，在这种情况下创建一个警报。 Test应该看起来像标准的navbar元素。这就是我试过的......

library(shiny)

ui <- navbarPage(title = "test", inverse = T,
              tabPanel("Simulate", "simulate panel"),
              tabPanel("Test", "test panel"), 

             #------ Add onclick action ------#
             tags$script("var a = $('.navbar-nav  li:nth-child(2) a');
               a.attr('data-toggle', 'noclass');
               a.click(function() {
                  alert('link clicked');
               });")
  )

server <- function(input, output) { 
}

shinyApp(ui = ui, server = server)

它基本上有效，但是当查看ui输出时，会附加一个额外的<li>元素，不需要在那里。

   <ul class="nav navbar-nav">
      <li class="active">
        <a href="#tab-9138-1" data-toggle="tab" data-value="Simulate">Simulate</a>
      </li>
      <li>
        <a href="#tab-9138-2" data-toggle="tab" data-value="Test">Test</a>
      </li>
      <li>
        <a href="#tab-9138-3" data-toggle="tab"></a>
      </li>
    </ul>

我的问题：

如何在导航栏中创建链接，避免使用额外的li元素。
有没有更好的方法来实现这一目标，即不会对li属性造成太大影响？

Answer 1

您可以将脚本放在navbarPage的标题中，并且不会创建额外的li。您可以向navbarPage添加id并使用它来引用脚本中的元素：

library(shiny)

ui <- navbarPage(title = "test", id = "nbpID", inverse = T,
                 header = tags$script("var a = $('#nbpID a[data-value=\"Test\"]');
                             a.attr('data-toggle', 'noclass');
                             a.click(function() {
                             alert('link clicked');
                             });"),
                 tabPanel("Simulate", "simulate panel"),
                 tabPanel("Test", "test panel")
)

server <- function(input, output) { 
}

shinyApp(ui = ui, server = server)

添加闪亮的navbar元素，在单击时触发JS

我的问题：

1 个答案: