文本区域中的制表符会导致 Opera 中失去焦点

所以我在文本区域中对 tab 键进行了 javascript 处理（插入制表符）。在大多数情况下，这是一种魅力。

问题：Opera：如果用户按住 Tab 键（选项卡插入速度非常快），文本区域元素将失去焦点，处理过程不起作用。正如您在下面的示例中看到的，焦点在 2 个按钮和文本区域之间不断变化。

法典：

<html>
<head>
<script type="text/javascript">
function onkd(e) {
    var keyCode = 0;
    if (document.selection) {
        keyCode = e.keyCode;
    } else {
        keyCode = e.which;
    }
    if (keyCode == 9) {
        if (e.preventDefault) {
            e.preventDefault();
            e.stopPropagation();
        } else {
            e.returnValue = false;
            e.cancelBubble = true
        }
        var o = document.getElementById("texta");
        if (o.setSelectionRange) {
            var sS = o.selectionStart;
            var sE = o.selectionEnd;
            o.value = o.value.substring(0, sS) + "t" + o.value.substr(sE);
            o.setSelectionRange(sS + 1, sS + 1);
            o.focus();
        } else if (o.createTextRange) {
            document.selection.createRange().text = "t";
        }
    }
}
</script>
</head>
<body>
<p><button type="submit">dummy button1</button></p>
<textarea id="texta" style="width: 400px; height: 400px; overflow: hidden; white-space: pre;" onkeydown="onkd(event);">hahaha huhuhu hohoho hihihi hehehe</textarea>
<p><button type="submit">dummy button2</button></p>
</body>
</html>

更新的JSFIDDLE：http://jsfiddle.net/JEzxx/2/

我可以捕捉到是否在 OnKeyUp 事件中按下 Tab 键，然后在 Onblur 中按下：

onblur="if (bIsTabPressed) document.getElementById('texta').focus(); return false;"

但这并不能解决问题。我不明白为什么当连续按下 Tab 键时，该元素首先会在歌剧中失去焦点。

问题似乎存在，因为 Opera 在键按下事件中没有提供 PreventDefault...正在调查解决方案...

好吧，opera 似乎是一个有缺陷的软件，而 preventdefault 仅在按键事件中起作用。所以我这样解决了：

function onkp(e) {
    if (e.keyCode == 9 && navigator.appName == "Opera") {
        e.preventDefault();
        e.stopPropagation();
    }
}

然而，副作用是无法在 Opera 中通过按住它来插入连续的制表符。

对于 Chrome：文本编辑器会压缩上一行的空格，因此请使用 <textarea wrap="off" ...
对于 Opera：我不知道，但您可以使用相同的键代码处理 onBlur（）并重新聚焦文本区域。

相关内容

最新更新

热门标签：