在鼠标悬停弹出窗口中显示闪亮的actionButton标题

Question

我曾经研究过如何在mouseover时显示actionButton标题。我理解javascript，但不确定如何解决这个问题。

在mouseover上，我希望显示Button的Title，而不是html代码本身。我将感谢任何帮助或想法来解决这个问题。以下是POC代码：

library(shiny)
library(DT)
library(dplyr)

shinyApp(
  ui = fluidPage(
    DT::dataTableOutput("table")
  ),
  server = function(input, output) {

  # create a summary table
    summary_iris <- group_by(iris, Species) %>%
      summarise(Count = n())

    summary_iris$Species <- levels(summary_iris$Species)

    shinyInput <- function(FUN, len, id, label, ...) {
      inputs <- character(len)

      for (i in seq_len(len)) {
        label <- summary_iris$Species[i]
        inputs[i] <- as.character(FUN(paste0(id, i),label=label, ...))
      }
      inputs
    }

    output$table <- DT::renderDataTable({
      DT <- summary_iris %>%
        mutate(Species = shinyInput(actionButton,
                                    nrow(summary_iris), 'button_', label = Species, class="bttn-unite",
                                    onclick = 'Shiny.onInputChange(\"select_button\",  this.id)'))
      DT::datatable(DT, rownames = FALSE, escape = FALSE,
                    options = list(rowCallback = JS(
                      "function(row, data) {",
                      "var full_text = data[0]",
                      "$('td:eq(0)', row).attr('title', full_text);",
                      "}")))
    })
  }
)

再次感谢您在我的研究过程中遗漏的帮助、提示或示例。

如何让按钮看起来像Unite Button on this site？这并不重要，但我也在为此而挣扎。

Answer 1

您可以使用正则表达式来提取文本：

rowCallback = JS(
  "function(row, data) {",
  "  var r = />(.*)</;",
  "  var full_text = r.exec(data[0])[1]",
  "  $('td:eq(0)', row).attr('title', full_text);",
  "}")

或者，您可以使用jQuery将字符串转换为HTML对象，然后提取文本：

rowCallback = JS(
  "function(row, data) {",
  "  var full_text = $(data[0]).text();",
  "  $('td:eq(0)', row).attr('title', full_text);",
  "}")