Как обновить содержимое htmlOutput в блестящем режиме с помощью JavaScript

Question

В блестящем приложении отображается предложение.

Когда пользователь выбирает часть предложения и нажимает кнопку Mark, чтобы добавить разметку, предложение должно быть обновлено, чтобы отразить действие.

Пример:
вход Образец: Образец предложение для демо
Выбор: предложения для
Желаемая выход: Образец <markup> sentence for </markup> демо

Ниже приводится блестящий код приложения и соответствующий код JavaScript:

library(shiny) 
ui <- fluidPage(
    tags$head(tags$script(src="addMarkup.js")), 
    titlePanel("Mark text selection"), 
    mainPanel(htmlOutput("content"), 
     actionButton("Mark", "Mark", onclick="addMarkup()") 
    ) 
) 

server <- function(input, output) { 
    sentence <- "A sample sentence for demo" 
    output$content <- renderText(sentence) 
} 

shinyApp(ui = ui, server = server) 

addMarkup.js

function addMarkup(){ 
    var sent=""; 
    sent= document.getElementById("content").innerHTML; 
    var selection=""; 
    if(window.getSelection){ 
    selection = window.getSelection().toString(); 
    } 
    else if(document.selection && document.selection.type != "Control"){ 
    selection = document.selection.createRange().text; 
    } 
    marked = "<markup>".concat(selection).concat("</markup>"); 
    result = sent.replace(selection, marked); 
    alert(result); 
    document.getElementById("content").innerHTML = result; 
} 

Проблема:alert(result) действительно показывает желаемый результат, но последующая строка не обновляет content.

Как я могу достичь этой функциональности?

Просьба также предложить, существует ли чистое блестящее решение (как я могу достичь без использования JavaScript).

Answer 1

Ваш код работает. проблема в том, что тег <markup> не существует в HTML. Если вы измените <markup> на <mark>, он будет работать.

marked = "<mark>".concat(selection).concat("</mark>");