防止<textarea>失去焦点以保持移动键盘

Question

＆lt; p＆gt;我正在开发一个webapp，它需要在聊天功能方面与移动兼容。目前，当您使用＆lt; code＆gt;＆lt; textarea＆gt;＆lt; / code＆gt;点击屏幕区域时弹出一些之前没有的其他按钮（以节省屏幕空间）。这些按钮是可用的，但目前发生的情况是，当您点击它们时，＆lt; code＆gt;＆lt; textarea＆gt;＆lt; / code＆gt;意识到它不再是焦点，因此移动键盘消失了。这创造了整体的跳跃体验。 ＆LT; / p为H. ＆lt; p＆gt;有人会想到一个能解决这个问题的JS解决方案吗？＆lt; / p＆gt;

Answer 1

伪编程解决方案：

function buttonClick
    do stuff...
    restore focus to textarea

实际上就是这样。

因此，JS解决方案将是：

function buttonClickHandler(){
    // do button stuff...
    document.getElementById('myTextarea').focus();
}

假设：

• buttonClickHandler是按钮的onclick事件功能
• myTextarea是textarea
的ID

Answer 2

使用jQuery，你可以这样做：

$('textarea')
    .focus() // set initial focus
    .on('blur', function () { // on blur
        $(this).focus(); // return focus
    });

DEMO：https://jsfiddle.net/v6do2utk/1/