如何激活的iOS键盘着眼于输入点击一个按钮后？

问题描述：

我正在开发一个搜索模块，并坚持在此功能中，逻辑是：在输入镜头的图标和重点如何激活的iOS键盘着眼于输入点击一个按钮后？

用户点击显示键盘

在Android这个工作得很好，只是把：

jQuery('input').focus();

，但在iOS上，这不工作时，输入显示，但不获得焦点，键盘没有出现，任何想法？

答

您可能需要使用touchstart为它在iOS上工作（这也应该适用于Android）。在单击处理程序，触发touchstart输入。我假设您输入的是myinput。

$('input.myinput').trigger('touchstart'); 

$('input.myinput').on('touchstart', function() { 

    $(this).focus(); 

})

我试过的东西呈三角这一点。我会尝试一下你的代码片段，然后回复一个反馈。 –

好，不要在所有的工作，有时触发键盘，有时不。我会继续尝试 –

答

这里是一个hacky变通。

位置你输入过顶镜头图标按钮。将输入容器设置为与按钮类似的宽度，并将不透明度设置为0，以使其不可见。事情是这样的：

div.input-container { 
    position: absolute; 
    top: 10px; 
    right: 10px; 
    width: 60px;  
    z-index: 1000;  
    opacity: 0; 
}

然后，当用户点击该按钮时，他们实际上是输入，将本地设置焦点内点击。添加输入点击事件处理程序以将不透明度设置为1可将输入宽度设置为适当的大小。

inputField.addEventListener('click', (event) => { 
    //use Jquery or plain JS to add a search-mode class to unhide the input 
}); 

div.input-container.search-mode {    
    width: 100%;     
    opacity: 0; 
}

您还必须添加一个方法来去除search-mode CSS类来获得输入字段回其初始隐藏状态。

如何激活的iOS键盘着眼于输入点击一个按钮后？

相关推荐