Javascript 同步span和textarea滚动条-滚动条稍微关闭和粘贴问题

我用以下方式设置了一个表，每个单元格包含一个span和一个textarea：

<table>
   <tr><td class="title">Original File</td></tr>
   <tr><td><span id='ogline' onscroll="og.scrollTop=scrollTop"></span><span><textarea onscroll="ogline.scrollTop=scrollTop" onkeyup="linenumber()" id='og' onfocusout="linenumber()"></textarea></span></td></tr>
</table>

这在某种程度上实现了我希望它实现的目标，其跨度大约与它应该在的位置相隔一条线。不过，我遇到的最大问题是，当我将大量文本粘贴到文本区域时。这几乎完全不起作用，两个滚动条都完全关闭，直到我按住其中一个滚动条相当长的时间，另一个滚动条才会试图赶上另一个滚动条

有什么建议吗？有没有更好的方法来解决这个问题，我应该试试？如有任何帮助，我们将不胜感激。

这可以：

var scrolling=false；
功能og_滚动（el）
{
如果（滚动&&el！=滚动）{
返回；
}
滚动=el；
var textareas=document.getElementsByTagName（'textarea'）；
对于（变量i=0；i 0）{
面积.顶部-=15；
}
}
函数关闭（num）
{
var area=document.getElementById（'og'+num）；
if（area.scrollTop

Html部分：

[向上][向下]
[上][下]
[上][下]

---

完整的html代码是。

此解决方案运行良好，但是当我将大量文本粘贴到其中一个文本区域时，仍然存在问题。使用此解决方案，当我将文件内容（在本例中为237行）粘贴到文本区域时，我无法再使用滚动按钮。我可以使用上下箭头键和ev任何东西都保持同步，但是当您尝试使用textarea的滚动键时，您根本无法移动。有没有解决方法？linenumber函数只是在外部div中添加一个数字，显示textarea中有多少行文本，不会影响多行文本的同步ExtArea和scroll\span按钮是指当textarea中有大量文本时，实际的向上箭头按钮和向下箭头按钮会激活。每当我在textarea中粘贴大量数据以激活textarea时，我都无法通过按这些按钮在textarea中向上或向下移动buttons@tRBK嗨，谢谢你的帮助解释。与普通javascript相比，使用jquery可以使所有这些内容变得更容易，这是可能的吗？无论如何，这里是。jquery也可以工作，我只是使用纯JS进行了初步尝试。不过，这个更新的脚本似乎工作得很好。感谢您的帮助。

<style>
span {
  width:93%;
  height: 100%;
}
textarea {
  width:92%;
  height: 100%;
  border-style:solid;
  border-color:black;
  border-width:2px;
  font-size:13px;
}
table {
  width:100%;
  height:100%;
}
.title {
  height:5%;
  text-align:center;
  background-color:#009;
  color:white;
}
#ogline {
  padding-top:4px;
  overflow:auto;
  font-size:12px;
  line-height:14.99px;
  width:6%;
}
</style>

onscroll="og.scrollTop=scrollTop"
onscroll="ogline.scrollTop = scrollTop