JS controls the Input/textarea element on iOS to hide the keyboard when it loses focus

When a colleague tests a product, it finds that " some pages have finished hitting the input box, and the keyboard for the iOS device cannot be hidden and the focus will not be lost when the dots are blank ."

With this question I tested and found that there was no such problem with Android devices.

So write JS to test the document to add a click event, found the cause of the problem:

Android can trigger the Click event, and the iphone will not trigger.

That is, under iOS devices you can click on the blank document and input will not lose focus.

Workaround:

Now that the click doesn't trigger an iphone event, you'll need to find a touch-screen event to trigger it once:

Objblurfun ("input");

//if the current touch point is not on input, it loses focus .functionObjblurfun (sdom,time) {varTime = time| | 300; varBrowser={versions:function(){            varU = navigator.useragent, app =navigator.appversion; return {Ios:!! U.match (/\ (i[^;] +;( U;)? Cpu.+mac OS x/),//iOS terminal            }; } (), Language: (Navigator.browserlanguage||navigator.language). toLowerCase ()}    if(Browser.versions.ios) {varobj =Document.queryselectorall (sdom);  for(vari=0;i<obj.length;i++) {Objblur (obj[i],time); }    }}    //element loses focus hidden keyboardfunctionObjblur (sdom,time) {varTime = time| | 300; if(sdom) {Sdom.addeventlistener ("Focus",function() {Document.addeventlistener ("Touchend", Doctouchend,false); },false); }Else{         Throw NewError ("Objblur () no element found"); }     varDoctouchend =function(event) {if(event.target!=sdom) {SetTimeout (function() {Sdom.blur (); Document.removeeventlistener (' Touchend ', Doctouchend,false);        },time);    }     }; }

JS controls the Input/textarea element on iOS to hide the keyboard when it loses focus