清除带有退格按钮的 selectizeInput 框 (maxItems = 1) 和 Mozilla Firefox 的问题

Question

我有一个带有多个 selectizeInput 小部件的 shinyapp。对于其中的大多数，用户只能输入一个选择。我的问题：

第一个小问题是我不知道如何在用户 selection 之后保持我的 场活动 ，因为它发生了when the choices selected are multiple (i. e. with the cursors still inside the box).如果用户输入了一个选项但决定立即使用键盘上的 backspace 按钮将其清除，这将很有用；
好的，退格键在这种情况下可能不起作用，但在 Mozilla Firefox 上使用这样的 shinyapp 时，这是一个重要问题。事实上，如果用户 select 有一个选择，然后 "instinctively" 按退格键清除它，网页会重新加载，所有其他 select 离子都会丢失。

下面是我的 shinyapp 中存在的 selectizeInput 小部件之一的示例：

selectizeInput(inputId = "country_study",
               label = h6("Country"),
               choices = c("China" = "",
                           "China", "India", "Iran"),
               selected = "",
               multiple = FALSE,
               options = list(create = FALSE))

回顾一下，用户可以select只有一个选择，但我想让他能够直接用键盘上的退格键删除这个选择无需通过鼠标再次激活小部件。

如果这不可能，我该如何处理 Mozilla Firefox 上的这种奇怪行为？

非常感谢！

Answer 1

感谢另一个 Whosebug post，我找到了解决方案，您可以找到 here.

在您的 fluidPage 的开头只需添加：

tags$head(includeScript("disable_backspace.js")),

在您的 App 目录中，使用文本编辑器创建 "disable_backspace.js" 文件并将以下代码粘贴到其中：

$(function(){
/*
 * this swallows backspace keys on any non-input element.
 * stops backspace -> back
 */
var rx = /INPUT|SELECT|TEXTAREA/i;

$(document).bind("keydown keypress", function(e){
    if( e.which == 8 ){ // 8 == backspace
        if(!rx.test(e.target.tagName) || e.target.disabled || e.target.readOnly ){
            e.preventDefault();
        }
    }
}); });

此解决方案归功于 thetoolman。

清除带有退格按钮的 selectizeInput 框 (maxItems = 1) 和 Mozilla Firefox 的问题

Clear selectizeInput box with backspace button (maxItems = 1) and troubles with Mozilla Firefox

mozilla

r

backspace

shiny

selectize.js