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

问题描述

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

I need to avoid to show the keyboard when a selectOneMenu is selected on mobile devices

有人建议在此问题中使用h:selectOneMenu:

Someone suggests to use h:selectOneMenu in this question:

如何如何防止使用Primefaces在ap:selectOneMenu上弹出键盘?

但是我需要使用p:selectOneMenu组件

But I need to use the p:selectOneMenu component

推荐答案

您可以覆盖SelectOneMenu focusFilter函数.

我们要做的是增加一个条件，如果不是移动设备，请集中精力，否则不要这样做.

What we have to do is adding one more condition, if it's not a mobile device do the focus otherwise don't do it.

这是重写的函数，只需在document.ready中执行它即可.

Here's the overridden function, just execute it in the 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();
       }
     }                          
 }    

然后我们再次检查它是否是移动设备，如果是的话，我们这次将foucsInput删除

Then we check if it's a mobileDevice again, if so we remove the foucsInput this time

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

注意:此问题已在PrimeFaces 5.2中修复.

Note: This has been fixed in PrimeFaces 5.2.

可以在 github ，还有一个在线演示.

这篇关于在移动设备上选择了selectOneMenu时，避免显示键盘的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！