1

因此，我对文本区域中的 tab 键进行了 javascript 处理（插入选项卡）。在大多数情况下，它是一种魅力。

问题： Opera：如果用户按住 tab 键（tab 插入非常快），textarea 元素失去焦点并且处理过程不起作用。正如您在下面的示例中看到的，焦点在 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;"

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

问题似乎存在，因为opera没有在keydown事件中提供preventdefault ...正在调查解决方案...

4

2 回答 2

1
  1. 对于 Chrome：文本编辑器压缩前一行的空白，所以使用<textarea wrap="off" ...
  2. 对于 Opera：我不知道，但是您可以使用相同的 keyCode 处理 onBlur() 并重新聚焦 textarea。
于 2012-09-23T11:36:55.197 回答
1

好吧，opera 似乎是一个有缺陷的软件，preventdefault 仅在 keypress 事件中有效。所以我这样解决了：

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

但是，它的副作用是无法在歌剧中通过按住它来插入连续的标签。

于 2012-09-23T13:57:39.083 回答