防止<text区域>避免失去焦点以保持移动键盘

Prevent <textarea> from losing focus to keep mobile keypad

本文关键字：焦点 移动 键盘 失去 text lt 区域 gt 防止      更新时间：2023-09-26

我正在开发一款网络应用程序，该应用程序需要在聊天功能方面与移动设备兼容。目前，当你用<textarea>点击屏幕区域时，会弹出一些以前没有的额外按钮（以节省屏幕空间）。这些按钮是可用的，但目前的情况是，当你点击它们时，<textarea>意识到它不再是焦点，因此移动键盘消失了。这创造了一种整体的跳跃体验。

有人能想出一个JS解决方案来解决这个问题吗？

伪编程解决方案：

function buttonClick
    do stuff...
    restore focus to textarea

事实上，仅此而已。

因此，JS的解决方案是：

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

假设：

  • buttonClickHandler是按钮的onclick事件功能
  • myTextarea是文本区域的id

使用jQuery，您可以执行以下操作：

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

演示：https://jsfiddle.net/v6do2utk/1/

相关文章：