在按键时更改单元格焦点

Question

我正在尝试实现一些我不确定是否会起作用的事情。我希望做的是在用户按下任何字母键时更改单元格焦点。我也希望这封信出现在源单元格中，而不是目标单元格中。我试图做的是：

用户通过单击单元格来标记它

table.onclick = function tableMouseListener(event) {
  markedCell = event.target;
  markedCellRow = markedCell.parentNode.rowIndex;
  markedCellCol = markedCell.cellIndex;
};

用户在标记的单元格中写入 A

$(document).keypress(function(e){
  if (e.keyCode == 65) {
    markedCell.appendChild(document.createTextNode(String.fromCharCode(e.keyCode)));
    jumpToNextCell();
  }    
});

键入 A 后，跳转到下一个单元格并将其聚焦

function jumpToNextCell() {
  table = document.getElementById('myTable');
  markedCellCol++;
  markedCell = table.rows[markedCellRow].cells[markedCellCol];
  markedCell.appendChild(document.createTextNode('u0020'));
  markedCell.focus();
}

上述逻辑的问题在于源单元格和目标单元格现在都有字母 A。

有没有办法防止将字母添加到目标单元格？

编辑

源单元格是

我标记的单元格，目标单元格是我要跳转到的单元格。

Answer 1

按键

后清除聚焦单元格

markedCell.innterText='';

在 JQuery 语法中

$('#markedCellSelector').val('');

Answer 2

我创建了一个实现整个功能的小提琴

这是JS代码：

var btns = Array.prototype.slice.call(document.querySelectorAll('button')),
    markedBtn;
btns.forEach(function(btn) {
    btn.addEventListener('click', function(){
        btns.forEach(function(btn) {
            btn.classList = Array.prototype.slice.call(btn.classList).filter(function(className) {
                return className !== 'marked';
            });
        });
        btn.className += ' marked';
        markedBtn = this;
    });
});
document.addEventListener('keyup', function(e) {
    var char = String.fromCharCode(e.which);
    if(markedBtn) {
        markedBtn.innerText = char;
        if(markedBtn.nextElementSibling) {
            markedBtn = markedBtn.nextElementSibling;
            markedBtn.click();
        }
    }
});