Question

我需要避免在移动设备上选择selectOneMenu时显示键盘

有人建议在这个问题中使用h：selectOneMenu：

How do I prevent the keyboard from popping up on a p:selectOneMenu using Primefaces?

但我需要使用p：selectOneMenu组件

Answer 1

您可以覆盖SelectOneMenu focusFilter功能。

我们要做的是再增加一个条件，如果它不是移动设备那么做焦点，否则不要这样做。

这是被覆盖的函数，只需在document.ready中执行。

//check if it's a mobile device
mobileDevice = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
PrimeFaces.widget.SelectOneMenu.prototype.focusFilter = function(timeout) {
   if(!mobileDevice) {
      if(timeout) {
         var $this = this;
         setTimeout(function() {
            $this.focusFilter();
         }, timeout);
       }
       else {
          this.filterInput.focus();
       }
     }                          
 }

然后我们再次检查它是否是mobileDevice，如果是，我们这次删除了foucsInput

if(mobileDevice) {
   for (var propertyName in PrimeFaces.widgets) {
      if (PrimeFaces.widgets[propertyName] instanceof PrimeFaces.widget.SelectOneMenu) {
         PrimeFaces.widgets[propertyName].focusInput.remove();
      }
   }
}

注意：这已在PrimeFaces 5.2中修复。

可以在github和online Demo上找到一个小工作示例。

Answer 2

尝试使用selectOneMenu的id（使用jQuery）

$(".mySelect").focus(function() {
        $(this).blur();
 });

OR

$('body').on("focus", '.mySelect', function(){
        $(this).blur();
});

使用blur属性的其他示例（仅使用javascript）：

如果这些字段的HTML看起来像这样：

<input type="text" name="username" id="username">
<input type="password" name="password" id="password">

然后JavaScript将是：

document.getElementById('username').blur();
document.getElementById('password').blur();

模糊：当一个元素失去焦点时会发送一个事件

之前这些对我有用。我希望这有帮助！

：）

在移动设备上选择selectOneMenu时，避免显示键盘

2 个答案: