javascript - 用鼠标单击/箭头键突出显示线条

Question

不久前，我问了一个关于如何在 mouseover 上突出显示文本行的问题。然而，当我使用它一段时间后，我注意到这个系统有一些缺陷。其中之一是用户在切换到新选项卡/移动鼠标做其他事情后会忘记他们在哪里。

这就是为什么我想做同样的事情，除了鼠标点击，或者更好的是，键盘上的箭头键。

我不知道这是否可能，因为我没有使用 jQuery 的经验。如果有人知道这样的脚本，或者如果有人可以给我写一个，那就太好了！

提前谢谢了！

Answer 1

这是这个 jquert 部分

$(document).ready(function() {
  $(".textWrapper").click(function(e) {
      var relativePos = e.pageY - this.offsetTop;
      var textRow = (Math.ceil(relativePos / 18) * 18) - 18;
      $(".highlight", this).css("top", textRow + "px");
      $(".highlight", this).show();
  });
});

当然还有 js fiddle http://jsfiddle.net/gFTrS/8/

对于箭头键，这有点棘手，因为我需要一种方法来计算段落中的行数