javascript - 在可编辑的 div 中添加选项卡功能

Question

我正在使用可编辑的 div 并希望在其中实现选项卡功能但不起作用。当我使用 html textarea 代替可编辑的 div 时，效果很好。下面的代码适用于工作正常的textarea：

<textarea id="txt" style="height: 125px; overflow-y: scroll; resize: none">@Html.Raw(Model.data)</textarea>

$('#txt').keydown(function (e) {
    var keyCode = e.keyCode || e.which;
    if (keyCode == 9) {// 9 for tab key
        var start = $(this).get(0).selectionStart;
        $(this).val($(this).val().substring(0, start) + "\t" + $(this).val().substring($(this).get(0).selectionEnd));
        $(this).get(0).selectionStart = $(this).get(0).selectionEnd = start + 1;
        return false;
    }
});

但是，当我使用下面的可编辑 div 到 textarea 时，它就不起作用了：

<div id="txt" contenteditable="true" style="text-align: justify; overflow-y: scroll;">
    <p>@Html.Raw(Model.data)</p>
</div>

Answer 1

<div id="txt" tabindex="0" contenteditable="true" style="text-align: justify; overflow-y: scroll;"/>

给 div atabindex以获得焦点。